自定义navigate+分包+自定义tabbar，有需要的可以拿去用用，可能会存在一些问题，根据自己的业务改改吧 大家也可以多多交流 代码片段：在这里 {"version":"1.1.5","update":[{"title":"修复 [复制代码片段提示] 无法使用的问题","date":"2020-06-15 09:20","imgs":[]}]} 更新日志:     2019-11-25  自定义navigate 也可以调用wx.showNavigationBarLoading 和 wx.hideNavigationBarLoading     2019-11-25  页面滚动条显示在自定义navigate 和 自定义tabbar上面的问题(点击“体验custom Tabbar” [图片] [图片] 其他demo: 云开发之微信支付：代码片段

场景： 电商平台商品推荐算法，是基于用户浏览商品进行推荐，介绍一下如何获取用户浏览列表的统计方法。 思路： 监听页面滚动 ——>判断用户浏览停留时间——>记录当前可视窗口的商品——>上报统计数据。 解析： 首先在页面滚动事件里监听，当用户停下来浏览超过1秒，获取当前屏幕视口有哪些商品，把获取到的商品记录下来，当用户离开页面上报曝光数据。 效果： [图片] 示例： https://developers.weixin.qq.com/s/YT6bJ7mx7NgE

写在前面： 大家不要将ICP证和ICP备案搞混了。 ICP证指的是【电信增值业务经营许可证】，这个资质需要企业主体至少100万注金，去工信部办理，比较难办理；社交-交友需要ICP证。 而ICP备案，【非经营性互联网信息服务备案核准】仅仅是指企业主体的域名备案，可以简单的按以下步骤免费办理成功，其他社交类目如社区、论坛、笔记等，只需要ICP备案即可。 1､在腾讯云注册一个账号并认证企业主体（不吹不黑，开发小程序当然首选腾讯云，好用）。http://www.qcloud.com/ 如果你是个人主体，就不要往下看了，没必要折腾了。 2､找到腾讯云免费活动页：https://cloud.tencent.com/act/free?from=10107 3､选择一款云服务器，180天免费试用。 云服务器申请成功后，它的使命就完成了，没用了，让它自生自灭吧。 在整个备案过程中，也不需要部署网站（域名都没有备案，哪来的网站？）。 [图片] 云服务器180天到期后，可以自己决定是否续费，每个月也才99元，促销期甚至更低，完全可以接受吧。 备案成功后，该服务器就没什么作用了，让它180天后自然欠费销毁得了。 服务器销毁后会有什么影响？答：没有任何影响。 但是。。。。。 你备案的域名最后还得指向一个网站，因为腾讯云会应工信部的要求定期检查网站是否合规，所以你还是要建一个简单的网站，（备案期间，可以暂时不管网站的事，等将来需要的时候再管理）。 至于有多简单，答，多简单都行。此时你可以在七牛、腾讯云、阿里云租点免费的对象存储空间，做个简单的网站。 4､在进行ICP备案之前，你需要在腾讯云注册你的域名地址，如果你已有域名，但不在腾讯云，建议先将要域名过户到腾讯云的账号上。 5､进入控制台，开始ICP备案，这个流程就不介绍了，因为完全一看就懂。而且现在使用备案小程序后，不需要幕布或现场拍照了，极其方便，大家跟着流程走就一点问题没有，有人脸识别和在线拍一段小视频。另外，大家可以随便作，随便填，填错或者填得不合适也不用怕，会有专门的备案客服打电话告诉你哪哪要改，还会告诉你应该怎么填才更容易通过工信部的审核，客服的态度好得发指。 仅说一点其中的几个小坑： a､人脸识别的时候，白色背景、白色背景、白色背景，笔者在人脸识别的时候，满世界找白墙，结果还被打回来重拍了3次。 b､网站用途一律写：公司官网，好通过工信部审核。 6､腾讯云提交资料到工信部审核。这是一个漫长的让人无语的等待，20-30天。笔者最近两次都是20天才过审；不要幻想会有可能提前完成审核，这是政府部门在审核，提前完成说明某政府人员的工作安排有问题，会犯错误的。 7､备案成功后，会有短信通知你，但是，你需要去工信部网站查询结果，并将结果切屏拷贝下来，因为小程序类目审核需要上传这张图片。http://beian.miit.gov.cn/publish/query/indexFirst.action [图片] 把上面这张图片保存好，小程序类目审核的时候需要上传。收到通知后，如果在这里查不到结果，也别急，据说需要24小时。 8､接下来是小程序上线审核。 因为ICP备案的小程序内容肯定涉及到社交，最后小程序上线时还要提交到工信部审核，还需要7天左右的时间，加上前面ICP备案的时间，加起来怎么也得30-40天。大家估计时间，别影响小程序上线。这7天也是政府部门在审核，不要幻想会提前。  9､计算一下时间： 腾讯云注册账号和认证：1-3天； 域名备案：腾讯云环节：1-3天； 域名备案：工信部环节：20-30天； 小程序添加服务类目：社交类目审核：1-3天； 小程序上线审核：腾讯环节：1-2天； 小程序上线审核：工信部环节：7+天； 总天数：30-40天； 10、节省时间的一些建议： 在开发小程序之前，就开始备案工作，小程序可以同时开发，相互不影响； 在开发完成之前一、两星期之内，先发布一版小程序，别管功能是不是完整，能通过审核就行，这样会有7天的等待类目审核的时间，这个时间里，小程序可以照常开发，不影响进度； 只要是社交类，基本需要有文字和图片安全检查功能，别忘了加上，别到时审核通过不了。 11、结束。 [图片]

js: [代码]const db = wx.cloud.database() const _ = db.command const col = "test" const sql = { _id: _.neq(1) } //获取所有记录 Page({ data: { isEndOfList: false, list: [], limit: 20 //每次拉取数量 }, onLoad: function(options) { this.getData() }, getData: function() { db.collection(col) .where(sql) .skip(this.data.list.length) .limit(this.data.limit) .get() .then(res => { this.setData({ list: [...this.data.list, ...res.data], //合并数据 isEndOfList: res.data.length < this.data.limit ? true : false //判断是否结束 }) }) }, onReachBottom: function() { this.data.isEndOfList || this.getData() } }) [代码] wxml [代码]<view style="height:100px" wx:for='{{list}}' wx:key='none'>{{index}}</view> <view style="padding:15px;text-align:center;color:grey" wx:if='{{list.length>limit}}'> <view wx:if='{{(!isEndOfList)}}'>正在加载数据...</view> <view wx:else>----END----</view> </view> [代码]

目前，小程序中支持使用async/await有三种模式： 1、不勾选es6转es5，不勾选增强编译；该模式是纯es7的async/await，需要基础库高版本。 2、勾选es6转es5，勾选增强编译；一般是因为调用了第三方的es5插件，通过增强编译支持async/await。 3、勾选es6转es5，不勾选增强编译；手工引入runtime.js支持async/await。 据最近更新情况，原生的函数已经大部分同时原生支持同步化了，不需要本方案转化了，直接加上await即可；比如wx.chooseImage、wx.showModal。。。具体有哪些，可以自己试。 如果只是wx.request的同步化，可参考： https://developers.weixin.qq.com/community/develop/article/doc/0004cc839407a069f77a416c056813  app.js代码： function promisify(api) {   return (opt, ...arg) => {     return new Promise((resolve, reject) => {       api(Object.assign({}, opt, { success: resolve, fail: reject }), ...arg)     })   } } App({   globalData: {},   chooseImage: promisify(wx.chooseImage),   request: promisify(wx.request),   getUserInfo: promisify(wx.getUserInfo),   onLaunch: function () {   }, }) 某page的index.js代码： const app = getApp() testAsync: async  function(){   let res = await app.chooseImage()   console.log(res)   res = await app.request({url:'url',method:'POST',data:{x:0,y:1}})   console.log(res) }, [图片]

本篇文章以小程序中的代表【微信小程序】为例，分享一下在微信小程序中实现多图上传的源码实现。 代码片段（可导入微信WEB开发者工具体验）：https://developers.weixin.qq.com/s/DHrt69mk7af3 两种不同实现方法的优缺点，请查看我的 博客原创文章，在文章中有详细的说明 小程序 多张图片上传 文章地址：https://blog.csdn.net/u013350495/article/details/104326088。 源码： const app = getApp()   Page({   data: {     // 已选择上传的本地图片地址     urlArr:['helang.jpg','1846492969.jpg','web.jpg']   },   onLoad: function () {        },   // 多图上传-回调式   uploadCallback(){     let index = 0;  // 当前位置，标识已上传到第几张图片     let newUrls = []; // 上传成功后的图片地址数组     // 图片上传方法     let upload = ()=>{       let nowUrl = this.data.urlArr[index]; //当前待上传的图片地址       wx.showLoading({         title: '正在上传',       });       /*          无图片上传接口，收setTimeout 模拟延迟状态         项目中替换为 wx.uploadFile 即可       */       // 假设每 1000ms 上传一张图片       setTimeout(()=>{         // 此处为已上传成功后的回调函数内容         let resUrl = `服务器返回上传后的地址 ${nowUrl}`; //假设这是上传成功后返回的地址         newUrls.push(resUrl); // 将上传后的地址添加到成功数组中           // 判断图片是否已经全部上传完成         if (index >= (this.data.urlArr.length-1)){           send();         }else{            //未全部上传完时标识位置+1并再次调用上传方法           index++;            upload();         }       },1000);     }     // 发送方法,用作图片上传完后，得到图片地址提交给其它接口或其它操作     let send = () => {       // 关闭加载提示       wx.hideLoading();       wx.showToast({         title: '上传成功',         icon:'success'       })         // 输出已经上传完的图片地址，请查看控制台结果       console.log(newUrls);     }       // 调用上传方法     upload();   },   // 多图上传-Promise   uploadPromise(){     /* Promise 对象数组 */     let p_arr = [];       /* 新建 Promise 方法，nowUrl参数为当前上传的图片地址 */     let new_p = (nowUrl) => {       return new Promise((resolve, reject) => {         /*          无图片上传接口，收setTimeout 模拟延迟状态         项目中替换为 wx.uploadFile 即可         */         // 假设每 1000ms 上传一张图片         setTimeout(()=>{           // 此处为已上传成功后的回调函数内容           let resUrl = `服务器返回上传后的地址 ${nowUrl}`; //假设这是上传成功后返回的地址           resolve(resUrl);         },1000);       })     }          // 遍历数据，创建相应的 Promise 数组数据     this.data.urlArr.forEach((item, index) => {       let nowUrl = this.data.urlArr[index]; //当前待上传的图片地址       p_arr.push(new_p(nowUrl));     });          wx.showLoading({       title: '正在上传',     });     /* 所有图片上传完成后调用该方法 */     Promise.all(p_arr).then((res) => {       // 关闭加载提示       wx.hideLoading();       wx.showToast({         title: '上传成功',         icon: 'success'       })       // 输出已经上传完的图片地址，请查看控制台结果       console.log(res);     });   } })

onload-more.js的内容如下 /* * 分页加载数据 */ const onloadMore = Behavior({ // 组件加载 attached() { if (thisdata.autoOnload) { // 开启自动加载数据let pages = getCurrentPages()let page = pages[pages.length - ] this.onShow() if (thisdata.onShowRefresh) { // 每次onShow都刷新数据// 拦截当前页面的onShow事件let oldOnShow = page.onShow page.onShow = () => { if (this.isActive()) { this.onShow() } if (oldOnShow) { oldOnShow() } } } // 拦截当前页面的上拉触底事件let oldOnReachBottom = page.onReachBottom page.onReachBottom = () => { if (this.isActive()) { this.onReachBottom() } if (oldOnReachBottom) { oldOnReachBottom() } } if (thisdata.isPullDownRefresh) { // 拦截当前页面的下拉刷新事件//需要设置 "enablePullDownRefresh": true,let oldOnPullDownRefresh = page.onPullDownRefresh page.onPullDownRefresh = () => { if (this.isActive()) { this.onPullDownRefresh() } if (oldOnPullDownRefresh) { oldOnPullDownRefresh() } } } } }, // 组件移除 detached() { // 组件移除后不再加载数据this.setData({ isInit: false }) }, observers: { 'params': function () { // 参数变化时初始化列表this.initList() } }, data: { autoOnload: true, // 是否自动加载数据,自动加载数据通过拦截页面的事件和生命周期实现 onShowRefresh: true, // 是否每次进入页面都刷新数据，当autoOnload为true时可用 isPullDownRefresh: true, // 是否开启下拉刷新 api: '', // 请求接口地址 isLoading: false, // 是否加载中 isEnd: false, // 数据是否已加载完毕 list: [], // 加载到的数据列表 page: { pageNum: , // 当前第几页 pageSize: 10// 每页多少条 }, params: {}, // 请求额外参数 isInit: false// 列表数据是否已经初始化 }, methods: { isActive () { returnthis.data.isInit }, // 组件所在页面的onShow事件 onShow () { this.initList() }, // 组件所在页面的onReachBottom事件 onReachBottom () { // 加载更多if (!thisdata.isEnd && !thisdata.isLoading) {console.log('触底加载')this.loadData() } }, // 组件所在页面的onPullDownRefresh事件 onPullDownRefresh () { // 初始化数据this.initList() setTimeout(() => { wx.stopPullDownRefresh() }, 400) }, // 初始化列表 initList: function () { this.setData({ page: {pageNum: , pageSize: 10}, isEnd: false }, () => { this.loadData(true) }) }, // 加载数据成功 loadDataSuccess (isInit) { if (isInit) { // 列表数据初始化完成 } else { // 当前页数据加载完成 } }, // 加载数据 loadData: function (isInit) { if (thisdata.isEnd || !thisdata.api) { return } this.setData({ isLoading: true }) wx.$request({ // wx.$request是我在wx.request的基础上做了简单的封装 url: thisdata.api, data: Object.assign({}, thisdata.page, thisdata.params) }).then(res => { // res的格式 /* let res = { code: 200, data: { rows: [] } } */ this.loadDataSuccess(isInit) // 加载数据成功 let list = thisdata.list let obj = { isEnd: res.data.rows.length < thisdata.page.pageSize, // 判断是否结束 isLoading: false, page: Object.assign({}, thisdata.page, {pageNum: thisdata.page.pageNum + }) // pageNum + 1 } if (!isInit) { // 加载第二页及以上数据// 数据局部更新 res.data.rows.forEach(item, i) => { obj['list['+ (list.length + i) + ']'] = this.filterItem(item, list.length + i) }) } else { // 初始化列表 obj.isInit = true obj.list = res.data.rows.map(item, i) =>this.filterItem(item, i)) } this.setData(obj) }).catch(() => { this.setData({ isLoading: false }) }) }, // 过滤item，oldIndex为在list中的index filterItem (item, oldIndex) { return item } } }) module.exports = {onloadMore} 使用方法 注意：Behavior只能在组件中使用 information组件中使用 [图片] [图片] loading组件主要是数据加载中、数据为空、数据加载完成的提示 [图片] [图片] 效果 information组件就是列表部分 [图片] 最后 代码片段：https://developers.weixin.qq.com/s/vazUgPmi7kdQ 第一次写如果有人看我就更新多一些用法，还有如果大家有更好的建议欢迎一起交流啊