功能说明 一轮密集的校友会小程序开发下来，发现有很多东西是复用的，可以抽象出来， 正好小程序提供了这种抽象的方法和能力 于是我将校友录小程序页面内的功能模块抽象成自定义组件， 以便在不同的校友录小程序页面中重复使用；   同时还有一个更大的好处：将复杂的校友会小程序页面拆分成多个低耦合的模块，有助于代码维护。   自定义校友录小程序组件在使用时与基础组件非常相似。   一些需要注意的细节：因为 WXML 节点标签名只能是小写字母、中划线和下划线的组合，所以自定义校友录小程序组件的标签名也只能包含这些字符。自定义校友录小程序组件也是可以引用自定义组件的，引用方法类似于页面引用自定义组件的方式（使用 [代码]usingComponents[代码] 字段）。自定义校友录小程序组件和页面所在项目根目录名不能以“wx-”为前缀，否则会报错。注意，是否在校友录小程序页面文件中使用 [代码]usingComponents[代码] 会使得页面的 [代码]this[代码] 对象的原型稍有差异，包括： 使用 [代码]usingComponents[代码] 页面的原型与不使用时不一致，即 [代码]Object.getPrototypeOf(this)[代码] 结果不同。使用 [代码]usingComponents[代码] 时会多一些方法，如 [代码]selectComponent[代码] 。出于性能考虑，使用 [代码]usingComponents[代码] 时， [代码]setData[代码] 内容不会被直接深复制，即 [代码]this.setData({ field: obj })[代码] 后 [代码]this.data.field === obj[代码] 。（深复制会在这个值被组件间传递时发生。）如果校友录小程序页面比较复杂，新增或删除 [代码]usingComponents[代码] 定义段时建议重新测试一下。   总结下来我们有校友评论组件，通用校友列表组件，校友图像上传组件，校友详情页面组件，Footer组件，校友会后台侧边组件等大的组件模块   UI设计 [图片] [图片] [图片]               前端代码逻辑  [图片]   后端代码逻辑[图片]     作者交流微信：cclinux0730 项目代码GIT: https://gitee.com/cclinux2/cc-alumni 分类: 小程序开发心得笔记, 小程序云开发, 校友会小程序开发笔记

前言(写给入坑的小白) 本文不涉及任何需要资质的小程序（如：视频类目）。小程序流量主是个人和小微企业主要变现途径之一，满1000人即可开通流量主（登录mp.weixin.qq.com，左侧边栏-推广-流量主-开通即可）。开通后，开发者可从流量主-广告位管理添加广告位，目前有6种广告位。 [图片] 正文（本文约很多字，分为四大主类，手里有1-10个小程序建议全部看完；手里有10个以上小程序，可跳过1、2、3，均为个人观点，不喜使劲喷） 一、小程序定位 小程序定位目前有以下四种，均不需要任何资质，个人(商城除外)/小微企业都可以做，由于本人不擅长文字表达，每个类型只选择一个做分析，谅解。 1、工具类 工具类有很多可以做：题库、技术文档、教程、去水印等。目前最火爆的应该属于疫情相关类的工具，关于疫情数据类小程序不做分析，没资质也没权利，主要说疫情周边可运营的工具。头像口罩，代表小程序：头像加口罩、戴个口罩吧、戴上口罩(每日搜索量约等于2000)，可参考以下做法： [图片] 以下为近7日访问数据量 [图片] 盈利方式：流量主 延伸参考：如果仅做头像加口罩的话，那么疫情过后，这个小程序会直线下降，将无任何作用。如果开发者手里目前有类似小程序，可参考“头像加口罩”做法，逐渐去延伸头像周边功能，例： ①、头像加字：头像+数字、头像加V、头像加字、头像加圣诞帽、新年头像边框、头像加福、头像加明星等 ②、聊天背景图、壁纸：武汉加油、卡通、美女（不要漏点太多）、二次元、跑车、科技等 ③、趣味九宫格配图：类似朋友圈9张图，中间获取用户自己头像，周围8张图弄点能吸引用户的等 ④、文字秀：微信昵称下标、上标、个性昵称等 运营分析：如果参考以上4点做法，首先你的程序再疫情结束后，不至于直线下滑，最起码能留住一些用户（UI很重要） 个人建议：工具类的好处就是不需要去长时间盯着后台，建议有想法的开发者，可以入门5-10个左右工具类小程序（功能不要相同）。 推广方式：参考本文第四大板块内容 2、返利类 主流返利平台：淘宝、天猫、拼多多、京东、蘑菇街、唯品会、网易考拉，以下参考 [图片] 盈利方式：返利(主)+流量主(辅) [图片] 基础分析：每个人微信里都会有一个或多个微信群是给你们购物优惠券链接的，他们盈利方式主要是靠每个平台的返利，比如淘宝天猫的叫“阿里妈妈”、拼多多的叫“多多进宝”等 运营分析： ①、平台功能：提供所有优惠券、商品返利、代理入驻、提现（个人可做收款码、企业可对接微信支付到零钱） ②、招代理商、可以给代理商(兼职、宝妈)50%以上的返利 ③、除了商品优惠券之外，可以把返利分给一部分给到用户。首先，用户会花更少的钱买到商品；其次，用户买完东西还会赚点小钱，每个月可提现到微信零钱。这样用户会发生裂变，省钱+赚钱。 个人建议：开发者至少有一个类似的返利小程序，每个月只需运营一天，工作内容一是把用户的返利发给用户&代理商，二是自己去各大平台领取每个月的“工资” 推广方式：参考本文第四大板块内容 3、商城类(个人开发者可跳过) 商城类，本人运营的比较少，每天就10-20单左右，卖啥就不做广告了 盈利方式：差价 基础分析：如果自己手里有一些商品低价资源，可以做一个“综合服务商城类目”，然后去试着用广告主去推一下 运营分析： ①、平台功能：砍价、返利、拼团、回购、入驻、积分、抽奖、游戏营销 ②、广告主曝光&点击报价不要最低，也不要最高，理由就是最低的话，80%的钱会给你推到一些质量很差的微信用户，比如我。 ③、对接圈子，虽然圈子刚起步，不确定能不能做大，万一呢？ 个人建议：企业一定要有一个自己的商城，哪怕没人买。这种东西怎么说呢，就好比一个企业站，虽然没什么用，但是得放那儿，万一客户要看呢？ 推广方式：参考本文第四大板块内容 4、游戏类（非小游戏） 答题、成语、找茬等类似运营的比较多，可自行搜索，不要认为这是游戏，开发者就望而却步，在线教育类目是可以通过的，这个开发者很多都不知道。以下可参考： [图片] 盈利方式：流量主 基础分析：基本所有的模式都是闯关类型，这种类型的小程序，基本都是用户消磨时间用 运营分析：关卡尽量多，入门、初级、中级、高级，高级模式可以做类比循环，形成无限关卡模式，闯关奖励机制，签到机制等。这种类型的小程序比较方便运营，裂变起来也快。 个人建议：裂变模式一定要有，虽然微信会严格把控这方面功能，但是开发者可以做一些技巧，不要让用户强制或者主动去触发，这样微信对开发者还是很友好的。 推广方式：参考本文第四大板块内容 二、小程序开发 有实力的开发者，自己开发，云开发很快，会前端就可以了，没实力的去正规平台买源码，论坛源码也很多，有部分论坛还是嵌入了比特币勒索，自己做好防护。个人建议：开发者能开发尽量自己开发，后期迭代方便，不要像我一样，50多个小程序80%是买现成去运营的。反正各有各的好处，开发者可自行决定，运营者可选择直接购买源码直接上线运营，前提是自己看好功能是不是和自己要的一样。有些SAAS平台的开发者实力还是可以的，支持定制功能。此处不做广告，自行搜索或者询问朋友。 三、广告位位置及利润 开发者的每个页面广告位一定要分开！一定要分开！一定要分开！这样做的目的是为了分析每个广告位的利润，好去做调整，把收益最大化。 失败案例举例：小程序的主页、个人中心页用同一个banner广告位，这样做出来一点好处都没有，后台只能看到banner收益是多少，看不到是哪个页面收益。极端情况，收益全部再首页，个人中心页没有广告收益，这种情况开发者是不知道的，如果把广告位分开，这种情况可以去优化个人页面，或者主页面换成视频banner。广告位分析页面：流量主--数据统计--广告数据--广告指标明细--细分数据 [图片] [图片] 1、很多人表示，疫情期间流量主收入下滑。这个原因不是因为微信调整流量主收益，根本问题是自己的用户质量。举个例子，当你开通流量主之后，你的用户还是这1000个，假如你第一天收益为100，你很开心，1000用户就能赚100，你第二天就放弃推广了，这样的话，你的用户质量是会逐渐下滑，微信方完全可以认定为你这1000人都是自己的号，去刷广告费的。长此以往下去，你的流量主利润会无限趋向于0。举个栗子： [图片] 2、广告位位置一定要合理好看，但是不代表“流氓”，比如全明星代言的某游戏“元宝无限收一刀999”点哪儿哪充值。开发者需要注意的是小程序的质量，需要用户在每个页面停留的时长最起码30秒，这样一个完整的视频广告才能曝光完。 3、banner广告收益是按有效点击计算的。很多人好几千曝光，但是点击只有几个、十几个，这种情况需要不断去优化接入的场景/位置，提高用户点击意愿。个人技巧：banner广告位尽量不要太多，1-2个就可以。尽量多放几个视频广告位，这样曝光也有收益。格子广告没试过，用过都说不好~ 4、激励广告作为流量主最高收益是有一定道理的，用户为了获取某些奖励是必须观看完整的，所以给开发者建议：用户如果可以获得小程序内某些奖励，可以适当多放一些激励广告位。 5、所有的广告位都是根据用户年龄、爱好等参数去调取相应的广告，开发者不需要去考虑 6、广告收益个人认为：激励》视频》插屏》前贴》banner》格子(格子没试过，暂放倒数第一) 四、小程序推广 尽量做成年人主打的小程序，有些开发者觉得好玩儿，做一些儿童益智类的小程序，你是认为儿童有手机，还是认为家长愿意让孩子玩儿手机呢？这个很不解。没有鄙视的意思，也许是情怀吧~~毕竟我做小程序比较俗，就是为了赚钱。 主流推广方式：公众号引流、截流，由于涉及一些不合常规的内容，本文只说常规操作，剩下的自己领悟，或者可以联系我~ 首先小程序的名字至关重要，一个好的名字可以带来无限的流量，再加上裂变功能（邪恶的微笑）。起名字的时候可以用到的工具：搜索小程序-微信指数，查询关键字，尽量找稳定再1000万以上的搜索量，从关键字中摸索自己的小程序名字。这样用户搜索到你的小程序几率会很高~ 1、工具类核心玩儿法（适用于所有小程序推广）：文章引流，截取关键字，火爆主题，比如2019年12月19日庆余年全集泄露、2020年疫情(不要发疫情数据内容，要发一些正能量的有内容文章去引流），我阅读过的文章最低的阅读量8000左右，最高的10万+，据说有好几百万的阅读量。如果你的文章写的好，结尾放一个小广告：为防止疫情蔓延，请给您的头像带上口罩~，啪，一个卡片小程序（或二维码），流量自己想~ 推广对象：18-30岁 2、返利类核心玩儿法： ①、可以参考工具类玩儿法 ②、各大微信群、QQ群，去推广，招代理等方式，或者去买一些基础流量，进行裂变，实际运营看下效果，好继续针对用户群体去推广，建立自己的群体系，群内发商品返利链接。微信好友没人？给你举个例子，我这篇文章发完，如果加个我的二维码，最起码能有100人加我，不是我文章写的有多好，是你永远不知道用户有什么样的目的和需求~ 推广对象：18-60岁 3、商城类核心玩儿法 ①、可参考返利类核心玩儿法，拥有自己的客户群体系，发一些自己的商品还是可以的，一定要带分销体系，你懂得~(最高3级，再高就是传销了) ②、广告主、目前效益个人感觉不明显，每次花1000块钱做广告，利润基本没有，和发广告的钱持平，而且用户留存也不是很高，可能是我的商品比较单一等各方面因素吧，不过赚流量还是不错的。 推广对象：18-30岁(以我的商城为例，还需看商城出售的内容) 4、游戏类核心玩儿法（非小游戏） ①、一个好的名字就够了。举例：精选商品橱窗（腾讯官方），微橱窗（我朋友的）。不得不说，这波流量很高，遗憾的是，他不是火爆的游戏类小程序~ [图片] ②、参考工具类玩儿法，文章引流截流 推广对象：18-40岁 五、小程序矩阵 矩阵一定要有，矩阵一定要有，矩阵一定要有，防截流，底配10个小程序。不是纯矩阵，是微信开发规定，每个小程序可以跳转10个小程序，开发者可以利用这个功能去添加自己的矩阵来获取更多的流量收益，保证自己的用户在自己的矩阵圈活动。 [图片] 写这篇文章主要是给大家传授经验，希望小白能学到点东西，入门后的朋友可领悟到更多运营方法，江湖之大，附月账单有缘再见 [图片]

最近老是有同学问我小程序ocr识别的问题，就趁机研究了下，实现了小程序识别身份证，银行卡，驾照，营业执照，图片文字的功能。今天来给大家讲讲详细的实现流程。 先画一张流程图出来 [图片] 第一次看到这个流程图，可能有点萌，什么云开发，云函数。。。。 不要着急，我们接下来会一步步带大家实现。 先看下我们的页面和效果图。 [图片] 功能其实很简单，就是我们点对应的按钮后，去拍照或者去相册选择对应的图片。然后把图片上传到云存储，会有一个对应的图片url，然后把这个图片url传递到云函数，然后云函数里使用小程序的开发ocr能力，来识别图片，返回对应的信息回来。如下图所示，我们识别银行卡（身份证什么的就不演示了，涉及到石头哥个人隐私） [图片] 接下来就是代码的实现了。 一，首先要创建一个云开发的小程序项目 这里我前面文章有讲解过，就不再细说了，不会的同学去翻看下我之前的文章。或者看下我录制的 讲解视频 这里有一点需要注意的给大家说下 [图片] 二，创建一个简单的小程序页面 1，index.wxml如下 [图片] 2，index.js完整代码如下 [代码]Page({ //身份证 shenfenzheng() { this.photo("shenfenzheng") }, //银行卡 yinhangka() { this.photo("yinhangka") }, //行驶证 xingshizheng() { this.photo("xingshizheng") }, //拍照或者从相册选择要识别的照片 photo(type) { let that = this wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { // tempFilePath可以作为img标签的src属性显示图片 let imgUrl = res.tempFilePaths[0]; that.uploadImg(type, imgUrl) } }) }, // 上传图片到云存储 uploadImg(type, imgUrl) { let that = this wx.cloud.uploadFile({ cloudPath: 'ocr/' + type + '.png', filePath: imgUrl, // 文件路径 success: res => { console.log("上传成功", res.fileID) that.getImgUrl(type, res.fileID) }, fail: err => { console.log("上传失败", err) } }) }, //获取云存储里的图片url getImgUrl(type, imgUrl) { let that = this wx.cloud.getTempFileURL({ fileList: [imgUrl], success: res => { let imgUrl = res.fileList[0].tempFileURL console.log("获取图片url成功", imgUrl) that.shibie(type, imgUrl) }, fail: err => { console.log("获取图片url失败", err) } }) }, //调用云函数，实现OCR识别 shibie(type, imgUrl) { wx.cloud.callFunction({ name: "ocr", data: { type: type, imgUrl: imgUrl }, success(res) { console.log("识别成功", res) }, fail(res) { console.log("识别失败", res) } }) } }) [代码] 上面代码注释讲解的很清楚了，再结合我们的流程图，相信你可以看明白。 [图片] 三，重头戏来了，识别的核心代码是下面这个云函数 [图片] 云函数的完整代码也给大家贴出来 [代码]// 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init() // 云函数入口函数 exports.main = async(event, context) => { let { type, imgUrl } = event switch (type) { case 'shenfenzheng': { // 识别身份证 return shenfenzheng(imgUrl) } case 'yinhangka': { // 识别银行卡 return yinhangka(imgUrl) } case 'xingshizheng': { // 识别行驶证 return xingshizheng(imgUrl) } default: { return } } } //识别身份证 async function shenfenzheng(imgUrl) { try { const result = await cloud.openapi.ocr.idcard({ type: 'photo', imgUrl: imgUrl }) return result } catch (err) { console.log(err) return err } } //识别银行卡 async function yinhangka(imgUrl) { try { const result = await cloud.openapi.ocr.bankcard({ type: 'photo', imgUrl: imgUrl }) return result } catch (err) { console.log(err) return err } } //识别行驶证 async function xingshizheng(imgUrl) { try { const result = await cloud.openapi.ocr.vehicleLicense({ type: 'photo', imgUrl: imgUrl }) return result } catch (err) { console.log(err) return err } } [代码] 其实没什么特别的，就是用一个switch方法，根据用户传入的不同的type值，来实现不同的识别效果。 如用传入的type是‘ yinhangka’，我们就调用银行卡识别 [代码]try { const result = await cloud.openapi.ocr.bankcard({ type: 'photo', imgUrl: imgUrl }) return result } catch (err) { console.log(err) return err } [代码] 进而把识别的结果返回给小程序端，如下图 [图片] 到这里我们就完整的实现了，小程序识别身份证，银行卡，行驶证的功能。至于别的更多的ocr识别，可以去看小程序官方文档，结合着我的这篇文章，相信你也可以轻松实现更多的图片识别。 [图片] 源码其实在上面都已经贴给大家了，如果你觉得不完整，想要完整的源码可以在文章底部留言或者私信我。

[图片] 该示例为纯手写代码，暂无插件，不多说直接上代码 我们的实现思路： JS部分 1、获取当前年月 const date = new Date(); cur_year = date.getFullYear(); cur_month = date.getMonth() + 1; const weeks_ch = [‘日’, ‘一’, ‘二’, ‘三’, ‘四’, ‘五’, ‘六’]; this.setData({ cur_year, cur_month, weeks_ch, }) 2、获取当月共多少天 getThisMonthDays: function (year, month) { return new Date(year, month, 0).getDate() }, 3、获取当月第一天星期几 getFirstDayOfWeek: function (year, month) { return new Date(Date.UTC(year, month - 1, 1)).getDay(); }, 4、计算当月1号前空了几个格子，把它填充在days数组的前面 calculateEmptyGrids: function (year, month) { var that = this; //计算每个月时要清零 that.setData({ days: [] }); const firstDayOfWeek = this.getFirstDayOfWeek(year, month); if (firstDayOfWeek > 0) { for (let i = 0; i < firstDayOfWeek; i++) { var obj = { date: null, isSign: false } that.data.days.push(obj); } this.setData({ days: that.data.days }); //清空 } else { this.setData({ days: [] }); } }, 5、绘制当月天数占的格子，并把它放到days数组中 calculateDays: function (year, month, sign) { var that = this; var isSign; const thisMonthDays = this.getThisMonthDays(year, month); for (var i = 1; i <= thisMonthDays; i++) { var obj = { date: i, isSign: ‘’ } for (var j = 0; j < sign.length; j++) { if (i == parseInt(sign[j].create_time.substr(8, 2))) { obj.isSign = true; break; } } that.data.days.push(obj); } this.setData({ days: that.data.days }); }, 6、切换控制年月，上一个月，下一个月 handleCalendar: function (e) { const handle = e.currentTarget.dataset.handle; const cur_year = this.data.cur_year; const cur_month = this.data.cur_month; if (handle === ‘prev’) { let newMonth = cur_month - 1; let newYear = cur_year; if (newMonth < 1) { newYear = cur_year - 1; newMonth = 12; } this.signRecord(newYear, newMonth); this.setData({ cur_year: newYear, cur_month: newMonth, imgType: ‘cnext.png’ }) } else { if (cur_month + 1 > month) { this.setData({ imgType: ‘next.png’ }) } else { let newMonth = cur_month + 1; let newYear = cur_year; if (newMonth > 12) { newYear = cur_year + 1; newMonth = 1; } this.signRecord(newYear, newMonth); if (cur_month + 1 == month) { this.setData({ cur_year: newYear, cur_month: newMonth, imgType: ‘next.png’ }) } else { this.setData({ cur_year: newYear, cur_month: newMonth, imgType: ‘cnext.png’ }) } } } }, wxml部分： <view class=‘all’> <view class=“bar”> <!-- 上一个月 --> <view class=“previous” bindtap=“handleCalendar” data-handle=“prev”> <image src=‘https://www.***.com/weChatImg/pre.png’></image> </view> <!-- 显示年月 --> <view class=“date”>{{cur_year || “–”}} / {{filter.fill(cur_month) || “–”}}</view> <!-- 下一个月 --> <view class=“next” bindtap=“handleCalendar” data-handle=“next”> <image src=‘https://www.***.com/weChatImg/{{imgType}}’></image> </view> </view> <view class=‘xxian’> <image src=‘weChatImg/huan.png’></image> <image src=‘weChatImg/huan.png’></image> </view> <!-- 显示星期 --> <view class=“week”> <view wx:for="{{weeks_ch}}" wx:key="{{index}}" data-idx="{{index}}">{{item}}</view> </view> <view class=‘days’> <!-- 列 --> <view class=“columns” wx:for="{{days.length/7}}" wx:for-index=“i” wx:key=“i”> <view wx:for="{{days}}" wx:for-index=“j” wx:key=“j”> <!-- 行 --> <view class=“rows” wx:if="{{j/7 == i}}"> <view class=“rows” wx:for="{{7}}" wx:for-index=“k” wx:key=“k”> <!-- 每个月份的空的单元格 --> <view class=‘cell’ wx:if="{{days[j+k].date == null}}"> <text decode="{{true}}">  </text> </view> <!-- 每个月份的有数字的单元格 --> <view class=‘cell’ wx:else> <!-- 当前日期已签到 --> <view wx:if="{{days[j+k].isSign == true}}" style=‘color:#acacac’ class=‘cell’> {{days[j+k].date}} <image src=‘https://www.***.com/weChatImg/sgin.png’></image> </view> <!-- 当前日期未签到 --> <view wx:else> <text>{{days[j+k].date}}</text> </view> </view> </view> </view> </view> </view> </view> </view> 相信大家通过以上思路，再结合自己的需求应该可以自己做出符合自己心目中的日历插件或者签到

[图片] 为了方便APP与WebAR能力的高效整合，今天我们正式推出WebAR SDK 1.0版本！ 我们不一样！ 超轻量级SDK重新定义AR >>>>这可能是目前体积最小的AR SDK 弥知科技自研WebAR底层算法，以Web为基础实现各类AR能力，接入我司AR功能后的APP大小增长低于300Kb！ >>>>AR场景制作更方便 接入弥知WebAR SDK后，所有的AR场景可使用KIVICUBE进行制作！这就意味着KIVICUBE中的简易编辑功能、海量素材模版都能直接调用，省时更省力！WebAR/微信AR在线制作工具KIVICUBE[图片] >>>>WebAR SDK支持内容 [图片] [图片] 超多场景！ 海量用户案例带来行业AR应用 刚刚说到了WebAR SDK能够使用KIVICUBE进行AR场景的制作，近期我们也在KIVICUBE陆续收集到了来自动漫影视、文创 、医学、快消品、旅游等多个垂直行业的AR用户案例。希望为还在苦恼如何下手制作一个AR场景的您提供一些启发 [视频] 如何接入？ 注意！这是一款完全免费的AR SDK 是的，目前我们全面开放WebAR SDK免费接入!欢迎大家关注“弥知科技”公众号后台回复“SDK”下载食用！ 同时，我们期待小伙伴们宝贵的意见和建议！在使用过程中遇到任何问题，欢迎添加下方我们的微信直接沟通！ [图片] 觉得好用，欢迎将我们分享给同样需要更轻量级、更便捷AR SDK的朋友！

[图片] #1 上次给客户小程序接入图灵机器人后，发现需要实现的功能很多都没有。 出于对客户保密，就不列出具体的哪些需求图灵机器人没有满足。 对比完云知声、百度、腾讯、出门问问、科大讯飞等智能对话机器人后， 客户决定采用微信对话开放平台  https://openai.weixin.qq.com 相比其他平台，微信对话开放平台对小程序开发有天然优势。 可使用 API 接入，也可使用官方的《微信对话开放平台小程序插件》接入。 这无疑大大节省了开发时间。 #2 现在微信对话开放平台处于推广期，不像其他智能对话机器人针对个人有使用次数限制。 其他功能方面可以去官网查看，就不一一列举了。毕竟没有担任他们的推广大使。 直接进入主题 通过插件接入平台也有两种方式， 一种是自己实现UI，使用平台的接口实现聊天交互。 另一种就是直接官方做好的也可以自定义样式的带UI的方式， 为了节省开发时间，就选第二种好了。不用自己写太多UI，只微调就好。 #3 在初始化 var plugin = requirePlugin("chatbot"); App({   onLaunch: function() {     console.log(plugin, "+++");     plugin.init({         appid: "P5Ot9PHJDechCYqDFAW1AiK6OtG3Ja", //小程序示例账户，仅供学习和参考         openid: "",//用户的openid，非必填，建议传递该参数         textToSpeech: false //默认为ture打开状态         success: () => {}, //非必填         fail: error => {} //非必填     });   } }); 和引用 {   "usingComponents": {     "chat": "plugin://chatbot/chat"   } } 后进行自定义组件微调UI的时候，懵了！ [图片] 这和平时写自定义组件的方式不太一样啊？之前自定义组件里的 properties 除了 type、value、 default 之外也没看过其他属性啊？这、这、 算了不说什么吧。 想办法吧，看看微信小程序自定义组件文档有没有之前没注意的地方。  https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/ 在看到组件生命周期时，就知道问题解决有望了。 Component({   lifetimes: {     attached: function() {       // 在组件实例进入页面节点树时执行     },     detached: function() {       // 在组件实例被从页面节点树移除时执行     },   },   // 以下是旧式的定义方式，可以保持对 <2.2.3 版本基础库的兼容   attached: function() {     // 在组件实例进入页面节点树时执行   },   detached: function() {     // 在组件实例被从页面节点树移除时执行   },   // ... }) 为什么？ 能看到组件自加载到销毁时发生了什么、产生了什么样的数据，问题自然也就迎刃而解了。 来看看组件加载时发生了什么 [图片] 很好，里面的 _data_ 字段好像出现了 msg 字样，我们再点开它看看是不是我们需要的 [图片] 很好，这就和官方的文档对上了。 [图片] 下面做的就很简单了，在组件 js 文件里写入 properties: {     msg: {       type: Object,     }   }, 然后在 wxml 里调用 msg 的相关属性值就可以了。 <scroll-view>     <view wx:for="{{msg.docs}}" wx:key>       <view>歌名：{{item.name}}</view>       <view>演唱:{{item.author}}</view>       <view>封面地址:{{item.album_pic_url}}</view>       <view>歌曲地址:{{item.url}}</view>     </view>   </scroll-view> 其他的几个可覆盖的组件类别按文档里对应的数据结构取值就好了，在这里就不一一演示了。 #4 到这里，微信对话开放平台自定义组件演示就结束了。如果你有其他疑问或者需求加我微信一起交流 [图片] 本文公章号地址： https://mp.weixin.qq.com/s?__biz=MzU5ODYwMjM3Nw==&mid=2247483705&idx=1&sn=8efa899870ebd6b45900fbd3b7dee133&chksm=fe40e6dfc9376fc989ca73833f458d0e084d560f39cee92985ce13a94558eff31fb183f51ff3&token=47255674&lang=zh_CN#rd

对于APP产品来说，小程序的产品属性更强，APP产品由于其独立性、功能多样性、内容丰富性等特征留给后期足够的运营空间。多样化的产品功能能够满足庞大用户群的需求，而对于小程序来说，由于其“即用即走”的特点，满足的是用户的及时性需求，产品对于用户的感知更加强烈。 [图片] 通过对TOP100小程序的观察，表现优秀的小程序都有产品轻量化、功能社交化、应用场景化3个共性，以交通出行类产品为例，携程、去哪、同程3家小程序产品 都在前100名内，旅游产品在小程序的设计上都选择了将预定机票、火车票、汽车票、酒店作为主要功能，舍去了旅游路线推荐等核心盈利点。 分享下我收集的小程序：https://www.sucaihuo.com/source/0-0-266-0-0-0 那么回到主题，小程序如何引流，微信作为目前用户单日使用频率高的产品，想要分得百度搜索的蛋糕难不难，我认为不难，但这需要一个过程，这个过程会有多长？ 垂直 做“垂直”的过程其实就是做关键词拆分的过程。 举个简单的例子，如果你的企业是做网站建设的，小程序的名字千万不能叫“网站建设”，不妨将“网站建设”进行拆分，拆分成“企业网站建设”“网站制作”“网 站开发”等等。每个小程序的开发框架其实一致，成本相差不大，内容进行针对性填充即可。另外就是做矩阵，做矩阵的目的不只是实现精准流量的获取，更为了实 现目标人群一致下的互相导流。 一目了然 你的小程序标题是否能让用户一眼就能明白这个小程序是做什么的，能给用户带来什么样的价值。千万不要只站在企业的角度去考虑标题，很多企业在标题里喜欢加上企业品牌，希望以此来扩大品牌曝光度和影响力，在我看来，完全没必要。 用户搜索量大 如果做一个小程序都没有人搜索，那么你的流量就会很低了。如何判断标题关键词搜索量高。我们可以尝试通过百度指数来分析“关键词”，或者微博指数、微信指数都可以找到。 微信生态流量足够大吗？足够大。小程序的流量红利还存在吗？答案也是肯定的，但就是因为这两点，容易让小程序开发者陷入另一个误区：流量红利=容易爆款，认为只要完成一个小程序丢入微信流量池就容易爆容易火，其实并不然。核心在分析，重点在试。