• 小程序

1.popup组件中的overlay会失效 对比微信小程序后发现，微信小程序中子组件会包含于shadow-root下 2.getRelationNodes确失 影响到this.children无效，进而影响到radio-group，collapse等组件 3.createSelectorQuery确失 影响组件index-bar

1.app.json中的usingComponents不能用 全局组件引入不能使用，需要单独文件引入 2.nextTick

最佳实践： 1.开发者如需获取用户身份标识符只需要调用wx.login接口即可。 2.开发者若需要在界面中展示用户的头像昵称信息，可以通过组件进行渲染，该组件无需用户确认，可以在界面中直接展示。 3.在部分场景（如社交类小程序）中，开发者需要在获取用户的头像昵称信息，可调用wx.getUserProfile接口，开发者每次通过该接口均需用户确认，请开发者妥善处理调用接口的时机，避免过度弹出弹窗骚扰用户。 来源：https://developers.weixin.qq.com/community/develop/doc/000cacfa20ce88df04cb468bc52801

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button> getPhoneNumber (e) { wx.cloud.callFunction({ name:’user’, data: { type:’phoneNumber’, weRunData: wx.cloud.CloudID(e.detail.cloudID) } }).then(res=>{ var phoneNumber = res.result.data this.setData({ phoneNumber:phoneNumber }) }) }, exports.main = async (event, context) => { var type = event.type switch(type){ case ‘phoneNumber’: data = event.weRunData.data.phoneNumber break } return { data: data, type: type } }

在使用微信小程序开发微信支付功能时，使用云开发中的微信支付云调用，将商品信息、支付价格等信息传入云函数中，并在返回的字段payment获取wx.requestPayment接口所需要的所有信息。通过此方法完成微信支付，在wx.requestPayment支付完成后，支付用户如果不点击支付界面中的完成按钮，wx.requestPayment不会触发回调函数success，因此如果将支付后的数据处理（如更新服务器中支付状态、更新商品余量等）就不会触发相应函数。 小程序这样设计wx.requestPayment的回调函数，目的在于将支付结果的处理放在服务器端，不能将支付结果的修改权限交给每一个付款的客户端（即不能自己付完款然后自己告诉服务器自己付款完成了！），因此这不是wx.requestPayment的BUG！！那么通过云开发怎么实现支付结果的通知呢？ 在微信支付云调用中，有两个参数functionName和envId，这两个参数就是用于支付结果回调用的。 微信支付云调用中云函数的代码：（注意functionName和envId要填写需要调用的云函数ID和函数名） // 云函数入口文件 const cloud = require(‘wx-server-sdk’) cloud.init() // 云函数入口函数 exports.main = asy…

1.文档 服务端: https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/customer-message/customerServiceMessage.getTempMedia.html button: https://developers.weixin.qq.com/miniprogram/dev/component/button.html 指南 :https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/customer-message/customer-message.html

相关资料： https://help.aliyun.com/document_detail/92883.html https://www.jianshu.com/p/937672b8bd46

1、附近小程序 这个功能推出很久，但还是培育状态。虽然不多，但流量还是有的。普通二三线城市每年几十个流量还是妥妥的。随着这种习惯慢慢普及，流量会持续向上。 2、好友分享 好友分享，除了某个东西特别有意思、有趣、还能学到东西。还可以考虑裂变功能：砍价、拼团、助力等。好友看到，自己想要。又会形成二次裂变。 3.微信群聊入口 小程序可转发到微信聊天对话框，支持好友私聊和微信群分享，在社交场景中相互传播，形成多个入口。这个入口相信大家并不陌生，甚至曾经一度感到厌烦。 小程序游戏全面开放之初，微信群充满着各种小游戏的分享，僵尸群也活跃了起来，一度让小程序分享打扰到用户，腾讯快速对小程序游戏的分享做出规范，规范小游戏的滥用分享，但不得不说，正是因为分享，小游戏才有了瞬间爆发。 4.主界面下拉菜单 下拉可以在较短的时间内，通过用户的记忆留存，获得高曝光，因此有极高的几率吸引用户再次进入。 而且“我的小程序”可以像微信公众号一样被关注，不会被最近使用的小程序冲走。那些工具类小程序或者极具创意的小程序将是这个入口的最大获益者。 5.搜索入口 微信的搜一搜功能不仅可以找个人号、公众号，还可搜索小程序。输入相关关键词就能够找到相应的小程序。 大家知道，我们需要找什么东西的时候才会用到搜索，因此搜索场景来的流量都十分精准。而且今年下半年开放了“品牌搜索”和“服务搜索…

<view class="li" bindtap="connectWifi"> <image src="/images/wifi.png"></image> <text>连接WIFI</text> </view> connectWifi: function () { var that = this; //检测手机型号 wx.getSystemInfo({ success: function (res) { var system = ”; if (res.platform == ‘android’) system = parseInt(res.system.substr(8)); if (res.platform == ‘ios’) system = parseInt(res.system.substr(4)); if (res.platform == ‘android’ && system < 6) { wx.showToast({ title: ‘手机版本不支持’, }) return } if (res.platform == ‘ios’ && system < …

1.新建一个json文件,localstorage_b72da75d79277d2f5f9c30c9177be57e.json { "show": false, "currentCategory": "general", "compiler": { "clusterCompile": false, "autoPreview": false, "autoRemoteDebug": false }, "general": { "openLastModifiedProject": true, "autoPreviewType": "mobile", "autoRemoteDebugType": "mobile", "maxLogLength": 300, "enableNewFW": true, "enableGPU": false, "ignoreUnsafeProxy": false, "locale…

1.模糊查询 单字段 var keyWord = ‘abc’ const db = wx.cloud.database() const _ = db.command db.collection(‘product’).where({ title: { $regex: ‘.*’ + keyWord, $options: ‘i’ } }).get() 多字段 var keyWord = ‘abc’ const db = wx.cloud.database() const _ = db.command db.collection(‘product’).where(_.or([ { title: db.RegExp({ regexp: ‘.*’ + keyWord, options: ‘i’, }) }, { subtitle: db.RegExp({ regexp: ‘.*’ + keyWord, options: ‘i’, }) } ])).get() 2.多个条件中的一个 const _ = db.command db.collection(‘todos’).where({ progress: _.in([0, 100]) }) .get({ success: console.log, fail: console.error }) 3.基于时间范…

1.登录到微信支付(https://pay.weixin.qq.com/)，提交各种企业资料开通微信支付功能 2.获取商户号和API密钥(初次设置需要先设置操作密码) 小程序端： testWxCloudPay: function () { wx.cloud.callFunction({ name: ‘getPay’, // data: {body:"body",attach:"attach",total_fee:1}, // 可传入相关参数。 success: res => { console.log(res.result) if (!res.result.appId) return wx.requestPayment({ …res.result, success: res => { console.log(res) } }) } }) }, 云函数getPay： const key = "ABC…XYZ" //换成你的商户key，32位 const mch_id = "1413092000" //换成你的商户号 //以下全部照抄即可 const cloud = require(‘wx-server-sdk’) const rp = requi…

环境初始化 1.创建新项目，启用云函数 2.所有文件复制后，云函数需要现在本地安装依赖包，再上传到云端 3.手动创建数据库，并确保权限无误，初始化config表 4.数据库设置索引，应为所有需要成为查询条件的字段建立索引 5.确保开发工具中的基础库版本一致 支付成功后发送提示消息 6.小程序后台添加订阅消息，注意不同行业消息字段不同 7.前端及云函数代码中都要填写模板ID，同时检查对应字段参数 客服 8.小程序后台添加客服，有新消息在“客服小助手”中回复 客服自动回复 9.云开发控制台->全局设置->添加消息推送配置->设置要触发的云函数（生效好像有延迟，刚添加不生效，等一会就好了） 小程序菊花码 10.images目录下小程序码更换 其他问题 11.如有奇怪问题可以查看基础库版本2.11.2

1.下载 http://airtest.netease.com/changelog.html 2.手机开启usb调试 华为手机开启方式 https://jingyan.baidu.com/article/a3aad71a0a4c4eb1fb00963a.html 3.AirtestIDE中操作 http://airtest.netease.com/docs/cn/2_device_connection/1_android_phone_connection.html https://www.cnblogs.com/xieqiankun/p/use_airtest.html

1.图片绘制到canvas <canvas type="2d" id="canvas"></canvas> <view catchtap="canvasSave">保存到相册</view> onLoad: function (options) { wx.createSelectorQuery() .select(‘#canvas’) .fields({ node: true, size: true, }) .exec(this.drawInit.bind(this)) }, drawInit: function (res) { const width = res[0].width const height = res[0].height const canvas = res[0].node const ctx = canvas.getContext(‘2d’) const dpr = wx.getSystemInfoSync().pixelRatio const canvasWidth = width * dpr const canvasHeight = height * dpr canvas.width = canvasWidth c…

1.单字段 var keyWord = ‘abc’ const db = wx.cloud.database() const _ = db.command db.collection(‘product’).where({ title: { $regex: ‘.*’ + keyWord, $options: ‘i’ } }).get() 2.多字段 var keyWord = ‘abc’ const db = wx.cloud.database() const _ = db.command db.collection(‘product’).where(_.or([ { title: db.RegExp({ regexp: ‘.*’ + keyWord, options: ‘i’, }) }, { subtitle: db.RegExp({ regexp: ‘.*’ + keyWord, options: ‘i’, }) } ])).get()

说明：用户头像名称等作为公开数据以前需要通过wx.getUserInfo接口获取,这个过程中会有弹框让用户授权，估计是觉得这个流程小题大做了，因此现在这部分数据可以直接通过open-data组件展示，但是要进一步获取更多身份特征信息就需要用button组件。 方式一: <open-data type="userAvatarUrl"></open-data> <open-data type="userNickName"></open-data> 方式二： <button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo">获取用户信息</button> onGotUserInfo: function (e) { console.log(e.detail.errMsg) console.log(e.detail.userInfo) console.log(e.detail.rawData) } 授权弹框中已经没有了拒绝按钮，因此可以重复弹出 其它： 云开发方式默认已经获取到了openid因此w…

整个流程涉及两次文件验证，各种平台密钥及id，账号关联操作，所用验证文件需放入自己的服务器对应目录 微信支付：https://pay.weixin.qq.com 1.商户号 2.获取api秘钥(私钥，自己本地生成后设置上去) 3.设置支付回调 4.账号关联，通过小程序AppID关联(产品中心-开发设置-APPID授权管理，关联小程序AppID) 5.生成支付相关的验证文件，微信支付商户平台证书，放入网站相关目录 /www/wwwroot/0915www.abc.cn/ThinkPHP/Library/Vendor/WxPay/lib/cert/ 微信公众平台：https://mp.weixin.qq.com 1.开发者ID(AppID) 2.开发者密码(AppSecret) 微信开放平台：https://open.weixin.qq.com 绑定小程序 小程序后台：https://mp.weixin.qq.com 1.AppID(小程序ID) 2.AppSecret(小程序密钥) request合法域名中需要加入https://api.mch.weixin.qq.com， 业务域名配置作用可以打开web-view标签链接，此时需要验证域名合法，将验证文件放入网站根目录 各种信息汇总 //微信公众平台： wxacd22e1524f32019 /…

1.注意点 小程序中定时器在页面切换时候并不会中断，后台会持续叠加请求，因此在页面销毁和隐藏时候需要中断循环，此处通过设置一个全局的标志位来处理 2.代码 data: { timerContinue: true }, // 点击左上角返回时候触发 onUnload: function () { this.data.timerContinue = false }, // 按系统home键返回时候触发 onHide: function () { this.data.timerContinue = false }, onShow: function () { this.data.timerContinue = true // 如果在tab对应的页面中，每次进入需要重新启动循环 this.updateEndTime(23,59,59) }, updateEndTime: function (_hour, _minute, _second) { 　//当前时间,距1970年1月1日的秒数 //通过返回的小时及分钟生成对应的日期对象 var now = new Date() var end = new Date() end.setHours(_hour) end.setMinutes(_minute) end.setSeconds(_second) //…

1，问题描述 用户通过分享进入商品详情页，此时小程序底部没有tab切换菜单，同时没有直观的按钮跳转到首页，左上角也没有返回上一页箭头，此时如果用户点击系统的Home返回键会退出小程序 2. 另一个问题 用户从上一步退出后，从小程序的最近使用下面再次进入，依然是刚刚退出的页面，没有直观的办法触达其它页面 3. 解决思路 首先想到通过场景值来做业务判断 4.场景值相关知识 app.js文件中 onShow: function (e) { console.log(e.scene) }, onLaunch: function (e) { console.log(e.scene) }, page页面中获取 onShow: function (e) { let val = wx.getLaunchOptionsSync() console.log(val.scene) }, 经过一番尝试发现，这个场景值只在小程序初次载入时候能获取到，用户如果刚刚打开过小程序，然后又通过别人分享到达商品页，此时的场景值是自己上次载入时候的值，所以这时候场景值并不能作为用户来源的依据 5.换个思路 既然场景值无法用，想到从路由列表入手，分享进入的用户，历史路由里只有唯一的一个当前页路由，这也是没有左上角返回按钮的原因所在，如果路由表长度为1，那么就显示一个跳转到首页的按钮出…

1.业务描述 通过微信支付开通vip，判断信息更新后再跳转 2.产生问题 通过setTimeout进行间隔一秒发送请求，数据比较，成功更新后通过wx.navigateTo跳转，此时setTimeout依然在后台持续调用 3.解决思路 setTimeout在每次调用后将生成一个标识符，而且每次都不同，所以用一个数组来保存起来，同时在页面离开时候清除所有的定时器 4.代码 data: { oldVal: ”, timeList: [] }, onLoad: function(options) { this.pay() }, // 点击左上角返回箭头时候触发 onUnload: function(options) { for (let i = 0; i < this.data.timeList.length; i++) { clearTimeout(this.data.timeList[i]) } }, // 点击系统Home键返回上一步时候触发 onHide: function(options) { for (let i = 0; i < this.data.timeList.length; i++) { clearTimeout(this.data.timeList[i]) } }, checkIsUpdate: function…

问题来源： 用户使用小程序时若关闭了定位权限，想要重新打开时操作不易，所以要引导去设置里重新打开 解决： 当第一次关闭授权定位后，wx.chooseLocation就会一直调用fail方法，所以当点击打开位置功能时，最好先判断当前是否关闭了定位授权（见wx.getSetting文档详情），再会跳出自定义弹框（showCon），引导前往设置打开定位 wx.chooseLocation({ success: function(e) { //允许打开定位 }, fail: () => { //不允许打开定位 wx.getSetting({ success: (res) => { if (!res.authSetting[‘scope.userLocation’]) { //打开提示框，提示前往设置页面 that.setData({ showCon: true }) } } }) } }) 由于前往设置需要使用button的open-type，因此弹框需要自定义，例如下方，不需要弹框的情况下引用button组件即可(详情见官方文档) //wxml <view wx:if="{{showCon}}" class="modal-mask" bindtap="changeModalCanc…

1.找到需要的图标，添加到购物车 https://www.iconfont.cn/ 2.打开购物车，点击下载代码 3.复制iconfont.css中的代码，放到app.wxss(全局样式，方便复用) 4.页面中使用 <text class="iconfont icon-gouwuche"></text>

1.相关代码 gotoAnchor: function() { const query = wx.createSelectorQuery() query.select(‘.cart-evaluation’).boundingClientRect() query.selectViewport().scrollOffset() query.exec(function(res){ res[0].top // #the-id节点的上边界坐标 res[1].scrollTop // 显示区域的竖直滚动位置 let distance = res[0].top + res[1].scrollTop wx.pageScrollTo({ scrollTop: distance }) }) } 参考链接： https://developers.weixin.qq.com/miniprogram/dev/api/wxml/SelectorQuery.html https://developers.weixin.qq.com/miniprogram/dev/framework/view/selector.html