微信小程序、浮动按钮、 返回顶部 、 悬浮按钮

微信小程序 返回顶部 拨打电话 悬浮按钮

把components 文件复制到项目中

在使用组件的页面 .json文件中,添加

{ "usingComponents": { "floatbut": "/components/floatbut/floatbut" } }

在使用组件的页面 .wxml 文件最底部,添加以下代码

//backTop 控制显示返回顶部按钮 <floatbut backTop="{{backTop}}"></floatbut>

在使用组件的页面 .js文件里面实现方法

data: { backTop:false }, //监听页面滚动 onPageScroll: function (e) { var that = this var scrollTop = e.scrollTop var backTop = scrollTop > 100 ? true : false that.setData({ backTop: backTop }) } 项目截图:

希望大家给个星。感谢

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。