20181012微信小程序填坑手册～

从6月份开始到现在，写小程序将近4个月了
开发时给自己埋了不少坑～
给大家分享下我的填坑经验～～

---

开发部分

1.小程序的组件修改不能触发页面刷新？
需要在父级文件上保存下才会触发
（使用wepy开发）

2.接口请求出现的问题？
记得勾选调试开发工具上 不校验合法域名

3.navigateTo跳转页面不生效？
页面栈最多支持10层，超过10层无法后退（10层之后有其他方法解决～）

• navigateTo, redirectTo 只能打开非 tabBar 页面。
• switchTab 只能打开 tabBar 页面。
• reLaunch 可以打开任意页面。

4.onload只会在页面加载时候执行，比如用navigateBack回到之前的页面的时候，之前那个页面不会再执行onload，
所以我们要触发某些函数的时候，我们可以放在onshow里面，即使是navigateBack回来也会执行

5.子组件的onload会在父组件onload之前执行，有一个页面加载完成3s后展示飘窗的需求，飘窗会立即被加载
可以在父子组件用EventHandle（类似vue的eventBus）通信下，以确定子组件加载时机～

6.操作用户头像（比如点击跳转）
open-data类似自定义组件，上面无法绑定事件，简单实现可以用navigator包裹open-data，不用写js代码即可实现点击跳转页面。navigator相当于html的a元素，默认为inline，可修改display样式为block
navigator组件属性 openType 可选值 'navigate'、'redirect'、'switchTab'，对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能

7.同一个页面想要2个分享？
需要在Page中添加onShareAppMessage方法，否则点右上角菜单不会出现转发选项
除了右上角菜单外，可以使用button组件的open-type="share"
button组件和右上角的点点点都是调用onShareAppMessage方法
通过参数中的from字段区分事件来源是菜单menu还是按钮button（某需求要求两个分享不同）
通过onShareAppMessage方法返回的对象来定制转发界面显示的内容

8.分享成功后的打点消失了？
是的，微信取消支持这个功能了。。。
在原来的分享接口中，用户发起分享动作之后，可以通过 success 、fail、complete等回调来判断用户是否完成了最后的分享动作。老代码也是分享成功的通过分享success回调函数内打log的记录。由于官方后来取消了这个功能，所以分享的打点要放到外面来。

9.canvas相关
要进行绘制，则canvas组件必须真实地被写在页面上，而且其wx:if不能为false。
canvas是原生组件，层级是最高的，所以页面中z-index设置不生效。
于是把canvas放置在屏幕之外，如设置position:fixed;left:750rpx;

canvas的api，在页面中，api的参数this不是必填的，在组件中就是必填的，页面中可不填。
在绘制canvas时，由于draw是异步操作，需要把canvasToTempFilePath写到draw成功的回调里
（起初是绘制内容少很快，用同步写也不会出问题）
绘制出来的图片如果觉得有点糊，请在canvas中等比例放大绘制尺寸～
但是也不能太大，不然在安卓上会有bug（限制范围貌似在2000px）。

10.全屏蒙版弹窗遮不住tabBar？
tabBar的层级还是很高的，当出现全屏蒙版弹窗时，是无法盖住tabBar的，
可以调用微信的hidetabbar，不过需要注意兼容低版本

11.在placeholder-class类设置的颜色并没有变化。
placeholder的颜色只能通过placeholder-style的方式设置
placeholder-style="color:#ccc"

测试部分

1.只用开发者工具测试能行吗？
有些功能是版本限制的，开发者工具的基础库版本可以调整，但是无法设置微信版本，还是需要真机。

2.扫描新生成的二维码会跳转到线上的链接？
以前是测试的时候需要用微信开发者工具来测试在编译模式，把二维码的具体信息添加进去
在最新的开发工具中，有一项 二维码编译 模式，解决了跳转线上小程序链接的问题

3.开发者工具上看效果没问题，但是在真机上测试不行？
一般说来都是真机缓存的影响，微信开发者工具是可以一键清理全部缓存
安卓和ios的上一般都是删除这个小程序（注意 不是删除使用记录）
再有就是，删除完毕后可以进入小程序的设置选项查看权限的开关来确定是否真的完全清除。

4.清除缓存后还有问题？
这时候就需要使用vConsole了
开发版和体验版可以点击真机小程序页面右上角的...按钮打开的菜单项“打开调试”来开启 vConsole
正式版没有“打开调试”的菜单项，可以先通过开发版和体验版来开启 vConsole，然后再打开正式版。
或者预埋一个隐藏操作，比如连续点击某个 Button 多次，然后调用 API 接口 wx.setEnableDebug 来打开。

5.如何远程调试真机？
vConsole一般用来看有无报错，如果是简单的问题，咱们直接修改代码就可以改好了了
复杂的情况还需要调试，手机毕竟看日志不方便，也不能断点调试、修改样式
此时需要借助远程调试来快速定位复杂问题～
使用开发者工具的远程调试窗口只要用手机扫一扫就可以连通手机和模拟器之间的数据链接，调试的上下文会自动切换到 VM Context 1

发布部分

上传代码的话，需要勾选 样式自动补全
一次没通过，请再提交一次吧:(