- 小程序登录的演变过程
1. 初版登录存在问题: 并发请求会有多次登录[图片]2. 存储promise[图片] 3. 使用存储promise优化存在问题: wx.checksession个别时候会出现fasle,原因未知无网络提示逻辑[图片] 4. 添加全局控制&校验网络存在问题: 无登录过期处理逻辑[图片] 5. 添加登录过期逻辑还可优化: 页面跳转预加载接口重试逻辑[图片] 6. 添加页面预加载相关[图片] 7. 完整流程[图片]
2020-09-02 - 短参数-扫太阳码进小程序流程
开发人员只需要完成普通的页面跳转到结果页过程的逻辑开发即可。 开发建议,函数编写尽量使用传参方式,减少页面全局变量的使用 eg: getGoodDetial(id){ goodDetailApi({ id:id }).then(res=>{ this.setData({ goodId: res.id }) }) } eg: error 错误例子 getGoodDetial(){ goodDetailApi({ id:this.data.goodId }).then(res=>{ }) } [图片]
2020-08-21 - 小程序多组件高复杂度实现方案
备注:此方法多适用于多模块高复杂度多插件的页面开发 原理:应用事件总线进行事件传递,并将数据挂载到wx上用于各个组件模块共享 一、事件总线事件总线挂载在wx对象上wx.eventBus派发事件 wx.eventBus.$emit('name',params)监听事件 wx.eventBus.$on('name',fn)示例: [图片] // 派发事件addCart 传递参数为1 wx.eventBus.$emit("addCart", 1) // 监听事件 // 方式1 wx.eventBus.$on("addCart", num => { this.setData({ number: num }); }); // 方式2 this.setNum为methods中的方法 wx.eventBus.$on("addCart", this.setNum).bind(this); 二、共享数据设置共享数据wx.setShareData(data)获取共享数据wx.getShareData()示例: [图片] // 设置共享数据 一般为主页面设置共享数据,组件更新部分数据 wx.setShareData({ data: { spu, sku, watch, postageFee }, chooseSkuInfo, // 选择的sku footerBtnType, pageSetting, closeCommunity: false }); // 获取共享数据 const { footerBtnType, pageSetting, chooseSkuInfo, data: { sku } } = wx.getShareData() // 组件中 更新部分数据 wx.setShareData({ chooseSkuInfo: { ...item, number: 1 } });
2020-08-19 - 分享扫码打开小程序操作实战
这是我们工作过程中的经验总结,现在分享给大家 说明:生成能打开小程序的二维码分为两种:1. 服务端调用接口生成;2. 前端生成二维码 一、服务端调用接口生成 https://api.weixin.qq.com/wxa/getwxacode?access_token=ACCESS_TOKEN 适用于需要的码数量较少的业务场景 生成小程序码,可接受 path 参数较长。 永久有效,可生成的码数量限制为 100,000 https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN 适用于需要的码数量极多的业务场景。 可接受页面参数较短,生成个数不受限。 永久有效,数量暂无限制 调用分钟频率受限(5000次/分钟) ,如需大量小程序码,预生成 https://api.weixin.qq.com/cgi-bin/wxaapp/createwxaqrcode?access_token=ACCESS_TOKEN 适用于需要的码数量较少的业务场景。 生成二维码,可接受 path 参数较长。 生成个数受限,可生成的码数量限制为 100,000 在小程序中接受参数方式:page onLoad函数中接受 [代码]Page({ onLoad(query) { // 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene const scene = decodeURIComponent(query.scene) } }) [代码] 二、前端生成二维码 操作步骤: 1. 在小程序后台(mp.weixin.qq.com)配置链接 https://mp.weixin.qq.com/wxopen/devprofile?action=get_profile&token=1318106189&lang=zh_CN [图片] 2. 点击添加: [图片] 3. 添加完成后点击上线 4. 在JS中用第三方库将拼接好的URL(比如: https://xxxxx/homeindex?orderId=123)生成二维码 小程序获取二维码中携带的参数: app.js的 onshow/onLoad函数中获取参数,options.query.q是生成二维码的完成URL,后截取URL获取相应参数 [代码]if (!!options.query && !!options.query.q) { let url = decodeURIComponent(options.query.q) if (url.indexOf('orderId') > -1) { let index = url.slice(url.indexOf('orderId')) if (index.indexOf('&') > -1) { let orderObj = index.slice(0, index.indexOf('&')) this.globalData.orderId = orderObj.split('=')[1] } else { this.globalData.orderId = index.split('=')[1] } } } [代码]
2019-08-16