前言
前段时间加入了开发小程序的队伍，我可算是把所有的坑的踩了。
现在把开发中那些注意点和各位小伙伴分享下。
一、小程序无法多图同时上传
uni.uploadFile只能支持单图上传，没上传一张调用一次接口，因此建议使用将所有请求放在promise里面进行发送。
这块要注意的点：
uploadFile需要设置域名
编辑图片获取图片信息时，需要用getImageInfo获取小程序帮我们暂存的图片路径。同时也要设置域名。
- 小程序在真机调试的时，图片可以成功上传，体验版本不打开调试无法上传。这块问题定位也是上传图片的域名问题，可能后台给的图片域名线上和线下不同。
二、小程序Json.parse时遇到特殊字符报错
场景：页面A跳转到页面B携带大量信息拼接在url后传送。
跳转之前将大量信息转成json字符串，然后在B页面Json.parse。
A页面
let transferData= JSON.stringify(data);
B页面
let getData = JSON.parse(transferData);
-
解决方案一
先将Stringify后的数据进行编码，然后再转换之前进行编码，这样可以解决特殊字符串jsonparse报错问题。
A页面
let transferData= JSON.stringify(data);transferData = encodeURIComponent(transferData);
B页面
let getData = JSON.parse(decodeURIComponent(transferData));
弊端：但是因为数据是拼接再url后面的，数据过长被截掉了怎么办？因此让我们看下解决方案二
- 解决方案二
使用uni.$emit进行通信，这种方法不适用此场景。因此A页面跳转到B页面，B页面还未加载。
这种方式使用在A页面监听，打开B页面时，B页面触发A页面的监听事件，这时候A页面接收到B页面的数据。
// A页面
onLoad(){
// 监听事件 （获取B页面的数据）
uni.$on('login',(usnerinfo)=>{
this.usnerinfo = usnerinfo;
})
},
// B页面
uni.$emit('login', {data:'这是我要给A页面的数据'});
很明显这种方法不适用于此场景
-
解决方案三
使用vuex进行通讯
解决方案四
使用globalData。
globalData是一种比较简单的全局变量使用方式。
在小程序中有globalData的概念，uni-app也实现了此功能，在App.vue可以定义globalData。
<script>
export default {
globalData: {
text: 'lxc'
},
methods: {
··· ···
}
}
</script>
赋值：
A页面
getApp().globalData.text = 'aliasName'
取值：
B页面
console.log(getApp().globalData.text) // 'aliasName'
页面渲染：
globalData的数据渲染，可以在页面的onShow生命周期进行操作。
弊端：但是！！globalData如果在当前页面刷新，定义的globalData就失效了。
原因很简单，这个不是本地缓存，是一种变量缓存刷新就会消失。
- 最终方案
最后决定用本地缓存在解决
uni.setStorageSync('传输的数据名称key', encodeURIComponent(JSON.stringify(data)));
JSON.parse(decodeURIComponent(uni.getStorageSync( '传输的数据名称key')));
弊端：目前这种解决方式的弊端查了下：小程序的数据缓存，最大支持10M。我们需要传输的数据是字段串类型，不会超过10M，因此此种方式暂时安全。【万一后续需求改了呢】
三、原生组件遮挡弹出框问题
弹出框被原生组件遮挡的问题可以在弹出框中使用cover-view来代替view，但是这会导致弹出框的显示效果发生变化，需要修改弹出框的样式。
更好的替代方法是：
如果原生组件是canvas，可以在弹出对话框时用image代替canvas。
如果原生组件是textarea则可以使用view来代替
四、小程序给scroll-view设置vh
在iphonex的尺寸下，scroll-view设置固定高度为100rpx，不会影响页面其他地方的滚动
{F179638}
但是切换到别的设备比如iphone5，scorll-view还是会占据相同的高度，会导致底部的数据【红色块】无法显示，只能通过页面滚动查看这个页面所有的数据。
因此设置将XXXrpx设置为 XXvh。
- vh是相对于视口的高度。视口被均分为100单位的vh
h1{font-size:8vh;}
如果视口的高度是200mm，那么上述代码中h1元素的字号将为16mm，即(8x200)/100
五、微信小程序运行的时候总是提示Uncaught TypeError: Cannot read property 'call' of undefined
场景：刚开始代码小不出现错误，到后来项目越来越大，代码和创建的页面多了起来，差量编译就开始报错了，而且越来越频繁，仅仅是我在js中删除了一行空格再ctrl+s 差量编译都开始报这个错误，特别是速度很快连续的ctrl+s 差量编译 时特容易报错，非常影响开发效率，报出来错误只能在uni中ctrl+f5重新整个编译，干等时间非常长。
ps：查了一下目前官方还没给出解决方案。也有说是运营商的问题。。。 在此记录下
