- 小程序app.onLaunch与page.onLoad异步问题的最佳实践
场景: 在小程序中大家应该都有这样的场景,在onLaunch里用wx.login静默登录拿到code,再用code去发送请求获取token、用户信息等,整个过程都是异步的,然后我们在业务页面里onLoad去用的时候异步请求还没回来,导致没拿到想要的数据,以往要么监听是否拿到,要么自己封装一套回调,总之都挺麻烦,每个页面都要写一堆无关当前页面的逻辑。 直接上终极解决方案,公司内部已接入两年很稳定: 1.可完美解决异步问题 2.不污染原生生命周期,与onLoad等钩子共存 3.使用方便 4.可灵活定制异步钩子 5.采用监听模式实现,接入无需修改以前相关逻辑 6.支持各种小程序和vue架构 。。。 //为了简洁明了的展示使用场景,以下有部分是伪代码,请勿直接粘贴使用,具体使用代码看Github文档 //app.js //globalData提出来声明 let globalData = { // 是否已拿到token token: '', // 用户信息 userInfo: { userId: '', head: '' } } //注册自定义钩子 import CustomHook from 'spa-custom-hooks'; CustomHook.install({ 'Login':{ name:'Login', watchKey: 'token', onUpdate(token){ //有token则触发此钩子 return !!token; } }, 'User':{ name:'User', watchKey: 'userInfo', onUpdate(user){ //获取到userinfo里的userId则触发此钩子 return !!user.userId; } } }, globalData) // 正常走初始化逻辑 App({ globalData, onLaunch() { //发起异步登录拿token login((token)=>{ this.globalData.token = token //使用token拿用户信息 getUser((user)=>{ this.globalData.user = user }) }) } }) //关键点来了 //Page.js,业务页面使用 Page({ onLoadLogin() { //拿到token啦,可以使用token发起请求了 const token = getApp().globalData.token }, onLoadUser() { //拿到用户信息啦 const userInfo = getApp().globalData.userInfo }, onReadyUser() { //页面初次渲染完毕 && 拿到用户信息,可以把头像渲染在canvas上面啦 const userInfo = getApp().globalData.userInfo // 获取canvas上下文 const ctx = getCanvasContext2d() ctx.drawImage(userInfo.head,0,0,100,100) }, onShowUser() { //页面每次显示 && 拿到用户信息,我要在页面每次显示的时候根据userInfo走不同的逻辑 const userInfo = getApp().globalData.userInfo switch(userInfo.sex){ case 0: // 走女生逻辑 break case 1: // 走男生逻辑 break } } }) 具体文档和Demo见↓ Github:https://github.com/1977474741/spa-custom-hooks 祝大家用的愉快,记得star哦
2023-04-23 - 不是很明白wx.checkSession的使用场景?
如题, 小程序授权登陆后 后端通过session_key 生成一个token 然后这个token的时效性是我们后端自己维护的 这种场景下用不到checkSession吧。
2019-09-23 - 微信小程序,订阅消息,点击消息进入H5页面,是不是在后台配置路径?
微信小程序,订阅消息,点击消息进入H5页面,是不是在后台配置路径且传递参数?假如web-view文件命名为webview,那么后台设置的路径就写成‘pages/webview/webview?url=’+a,小程序的webview界面能接收到参数吗?
2020-06-28 - 移除小程序后,点击消息订阅卡片进入小程序,无法跳转指定页面?
移除小程序后,点击消息订阅卡片进入小程序,无法跳转到指定页面;已经进入过小程序再次点击卡片可跳转到指定页面。 但是公众号推送消息和短信提醒都可以跳转到指定页面,小程序移除后也可以。 有什么区别么?程序中没有做拦截处理
2021-04-07 - 页面onTabItemTap与onShow的触发顺序
期望: onTabItemTap内执行A操作 onShow内执行B操作 期望执行的顺序是 A -> B 问题:发现onTabItemTap的触发是在onShow之后,会变成 B -> A 尝试解决: 不过这样是否能保证 A -> B 的执行顺序呢? [代码]Page({[代码][代码] [代码][代码]onTabItemTap() {[代码][代码] [代码][代码]// 执行A操作[代码][代码] [代码][代码]},[代码][代码] [代码][代码]onShow() {[代码][代码] [代码][代码]setTimeout(() => {[代码][代码] [代码][代码]// 执行B操作 [代码][代码] [代码][代码]}, 10) [代码][代码] [代码][代码]}[代码][代码]})[代码]
2018-06-14