小程序面试题

刺骨的言语ヽ痛彻心扉 2022-11-15 05:47 95阅读 0赞

app.json 全局配置文件描述  
pages : 用于存放当前小程序的所有页面路径  
window : 小程序所有页面的顶部背景颜色，文字颜色配置。  
tabBar : 小程序底部的 Tab ,最多5个，最少2个。

2、简述下 wx.navigateTo(), wx.redirectTo(), wx.switchTab(), wx.navigateBack(), wx.reLaunch() 区别  
wx.navigateTo() : 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面  
wx.redirectTo() : 关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面  
wx.switchTab() : 跳转到 TabBar 页面，并关闭其他所有非 tabBar 页面  
wx.navigateBack() : 关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈，决定需要返回几层  
wx.reLaunch() : 关闭所有页面，打开到应用的某个页面。

3、小程序有哪些传递数据的方法

使用全局变量  
在 app.js 中的 this.globalData = \{ \} 中放入要存储的数据。  
在 组件.js 中， 头部 引入 const app = getApp(); 获取到全局变量  
直接使用 app.globalData.key 来进行赋值和获取值。  
使用路由  
wx.navigateTo 和 wx.redirectTo 时，可以通过在 url 后 拼接 + 变量， 然后在 目标页面 通过在 onLoad 周期中，通过参数来获取传递过来的值。  
使用本地缓存

4、小程序 WXSS 与 CSS 的区别  
WXSS  
wxss 背景图片只能引入外链，不能使用本地图片  
小程序样式使用 @import 引入 外联样式文件，地址为相对路径。  
尺寸单位为 rpx , rpx 是响应式像素,可以根据屏幕宽度进行自适应。

5、小程序的双向绑定和Vue哪里不一样。  
小程序 直接使用this.data.key = value 是 不能更新到视图当中的。  
必须使用 this.setData(\{ key ：value \}) 来更新值。

6、小程序的生命周期函数  
onLoad : 页面加载时触发。一个页面只会调用一次，可以在 onLoad的参数中获取打开当前页面路径中的参数  
onShow : 页面显示 / 切入前台时触发调用。  
onReady : 页面初次渲染完成时触发,一个页面只会调用一次。  
onHide : 页面隐藏 / 切入后台时触发，如 navigateTo 或底部 tab切换到其他页面，小程序切入后台等  
onUnload : 页面卸载时触发。如 redirectTo或 navigateBack 到其他页面时.

7、小程序怎么实现下拉刷新  
两种方案  
方案 一 ：  
通过在 app.json 中， 将 “enablePullDownRefresh”: true, 开启全局下拉刷新。  
或者通过在 组件 .json ， 将 “enablePullDownRefresh”: true, 单组件下拉刷新。  
方案二：  
scroll-view ：使用该滚动组件 自定义刷新，通过 bindscrolltoupper 属性， 当滚动到顶部/左边，会触发 scrolltoupper事件，所以我们可以利用这个属性，来实现下拉刷新功能。

8、 bindtap 和 catchtap 区别  
相同点： 都是点击事件  
不同点： bindtap 不会阻止冒泡， catchtap 可以阻止冒泡。

9、webview中的页面怎么跳回小程序中？参考：https://blog.csdn.net/qq\_36742720/article/details/81501955  
首先，需要在你的html页面中引用一个js文件。

然后为你的按钮标签注册一个点击事件：  
$(".kaiqi").click(function()\{  
wx.miniProgram.redirectTo(\{url: ‘/pages/indexTwo/indexTwo’\})  
\});

这里的redirectTo跟小程序中的wx.redirectTo()跳转页面是一样的，会关闭当前页跳转到页面。  
你也可以替换成navigateTo，跳转页面不会关闭当前页。

10、使用webview直接加载要注意哪些事项？参考：https://blog.csdn.net/rolan1993/article/details/78709463  
答: 一、必须要在小程序后台使用管理员添加业务域名；  
二、h5页面跳转至小程序的脚本必须是1.3.1以上；  
三、微信分享只可以都是小程序的主名称了，如果要自定义分享的内容，需小程序版本在1.7.1以上；  
四、h5的支付不可以是微信公众号的appid，必须是小程序的appid，而且用户的openid也必须是用户和小程序的。

11、小程序支付如何实现？  
我们做要简单，其实我更认为是小程序只有1M，更多的东西给后台吧

1、小程序注册，要以公司的以身份去注册一个小程序，才有微信支付权限；

2、绑定商户号。

3、在小程序填写合法域

4.调用wx.login()获取appid

5.调用  
wx.requestPayment(  
\{  
‘timeStamp’: ‘’,//时间戳从1970年1月1日00:00:00至今的秒数,即当前的时间  
‘nonceStr’: ‘’,//随机字符串，长度为32个字符以下。  
‘package’: ‘’,//统一下单接口返回的 prepay\_id 参数值，提交格式如：prepay\_id=\*  
‘signType’: ‘MD5’,//签名类型，默认为MD5，支持HMAC-SHA256和MD5。注意此处需与统一下单的签名类型一致  
‘paySign’: ‘’,//签名,具体签名方案参见微信公众号支付帮助文档;  
‘success’:function(res)\{\},//成功回调  
‘fail’:function(res)\{\},//失败  
‘complete’:function(res)\{\}//接口调用结束的回调函数（调用成功、失败都会执行）  
\})

12、小程序授权登录流程  
调用 wx.login 获取 code。  
使用 wx.getSetting 获取用户的授权情况  
如果用户已经授权，直接调用 API wx.getUserInfo 获取用户最新的信息；  
用户未授权，在界面中显示一个按钮提示用户登入，当用户点击并授权后就获取到用户的最新信息。  
将获取到的用户数据连同wx.login返回的code一同传给后端  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ5MDE2NzA5_size_16_color_FFFFFF_t_70_pic_center]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ5MDE2NzA5_size_16_color_FFFFFF_t_70_pic_center]: /images/20221022/73e63b90452942dc8329e28193eba6ab.png