微信小程序常见面试题13道

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' })

相关推荐
亮子AI5 分钟前
【小程序】微信小程序点击效果(view、button、navigator)
微信小程序·小程序
Q_Q51100828524 分钟前
python+uniapp基于微信小程序团购系统
spring boot·python·微信小程序·django·uni-app·node.js·php
future_studio29 分钟前
聊聊 Unity(小白专享、C# 小程序 之 加密存储)
开发语言·小程序·c#
炒毛豆1 小时前
uniapp微信小程序+vue3基础内容介绍~(含标签、组件生命周期、页面生命周期、条件编译(一码多用)、分包))
vue.js·微信小程序·uni-app
從南走到北1 小时前
洗车小程序系统
微信小程序·小程序
namehu3 小时前
前端性能优化之:图片缩放 🚀
前端·性能优化·微信小程序
dazhong20123 小时前
微信小程序开发实战指南(三)-- Webview访问总结
微信小程序·小程序
计算机毕业设计小帅3 小时前
【2026计算机毕业设计】基于Springboot的校园失物招领小程序
spring boot·小程序·课程设计
盛夏绽放5 小时前
关于 uni-app 与原生微信小程序中的生命周期 —— 一次“生命旅程”的解读
微信小程序·小程序·uni-app
流水线上的指令侠6 小时前
使用C#写微信小程序后端——电商微信小程序
微信小程序·小程序·c#·visual studio