1、bindtap 和 catchtap 区别
bindtap 不会阻止冒泡,catchtap 可以阻止冒泡。
2、小程序有哪些传递数据的方法
使用全局变量实现数据传递。在 app.js 文件中定义全局变量 globalData, 将需要存储的信息存放在里面;
使用 navigateTo 与 redirectTo 的时候,可以将数据拼接在 url 后面,然后在目标页面的 onLoad 生命周期中获取传递过来的值;
使用本地缓存 storage。
3、简述下 navigateTo(),redirectTo(),switchTab(),navigateBack(),reLaunch() 的区别
wx.navigateTo():保留当前页面,然后跳转到某个页面。但是不能跳转到 tabbar 页面;
wx.redirectTo() :关闭当前页面,然后跳转到某个页面。但是不能跳转到 tabbar 页面;
wx.switchTab():跳转到某个 tabbar 页面,并关闭其他所有非 tabbar 页面;
wx.navigateBack():关闭当前页面,返回到上一页面或目标页面。可通过 getCurrentPages 获取当前的页面栈,决定需要返回几层;
wx.reLaunch():关闭所有页面,打开某个页面。
4、小程序 wx:if 和 hidden 的区别
wx:if 有更高的切换消耗,hidden 有更高的初始渲染消耗。如果频繁切换,用 hidden,如果在运行时条件不轻易改变则使用 wx:if。
5、在小程序中如何获取用户信息
使用 button 并设置其属性:open-type="getUserInfo",在 bindgetuserinfo 绑定的回调函数中通过 e.detail 获取。
<button open-type="getUserInfo" "bindgetuserinfo"="eventhandle">获取用户信息</button>
6、小程序中如何实现分享功能
转发给朋友:监听用户点击页面内转发按钮(button 组件 open-type="share")或右上角菜单"转发"按钮的行为,然后在页面的 onShareAppMessage() 函数中自定义转发内容。
分享到朋友圈:监听右上角菜单"分享到朋友圈"按钮的行为, 然后在页面的 onShareTimeline() 函数中自定义分享内容。
7、小程序中如何用像Vant一样的第三方组件
在命令行中执行:npm init,初始化项目
安装组件
在小程序开发工具中,选择【工具】菜单 -> 选择【构建 npm】命令
8、小程序如何实现父子组件传参
父传子:在子组件中定义属性,父组件在引用子组件的时候通过设置属性的值给子组件传值;
子传父:在组件中绑定一个自定义事件,在子组件中通过 triggerEvent('myevent', myEventDetail) 触发这个事件,给父组件传值。
9、如何实现下拉刷新
通过在 app.json(全局)或者页面的 json 中配置 "enablePullDownRefresh": true,开启下拉刷新;
也可使用 scroll-view 组件,当滚动到顶部会触发 scrolltoupper 事件,在这个事件里自定义实现下拉刷新。
10、小程序 onPageScroll 方法的使用注意什么
由于此方法调用频繁,不需要时应该去掉,不要保留空方法,避免在此方法中频繁调用 setData() 或同步 API。
11、小程序视图渲染结束后回调
使用 setData(data, callback),在 callback 回调方法中添加后续操作代码。
12、webview 的页面怎么跳转到小程序导航的页面
小程序导航的页面可以通过 switchTab 跳转,但默认情况是不会重新加载数据的。若需加载新数据,则在 success 属性中处理:
success: function (e) {
var page = getCurrentPages().pop();
if (page == undefined || page == null) return;
page.onLoad();
}
webview 的页面,则通过:
wx.miniProgram.switchTab({
url: '/pages/index/index'
})
13、webview 中的页面怎么跳回小程序中?
webview 网页中可使用 JSSDK1.3.2 提供的接口返回小程序页面
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
// javascript
wx.miniProgram.navigateTo({url: '/pages/login/login'+'$params' })