微信小程序遇到的那些坑

最近一直在折腾微信小程序(内测阶段)，开发过程中遇到了不少坑，有些是队友踩的，记录一下。后续补充。

一、关于html

（小程序抛弃了html原生标签，开发者必须使用官方定义的标签，如容器<view>、文本<text>、输入框<input>、图片<image>、图标<icon>、按钮<button>等等）

1. 没有textarea标签，<input>也没提供textarea类别，多行文本暂未找到解决方法。

2. <input>文字输入完毕后，点击键盘确定，input竟然自动清空！！再重复一次操作，才正常显示。

3. 文本<text>不能多层嵌套。

4. 图片尽量使用<image>或<icon>，少使用背景图background-image，背景图在真机测试时显示为空。(怀疑是图片不是绝对路径或https问题，待验证)

5. 如果你项目中按钮样式特别，还是建议用<view>或<text>来模拟好了，因为官方已经给<button>定义了复杂的样式，重定义真的很费代码。

6.<picker>弹层样式不能自定义，且日期和时间只能分开选择，且在开发者工具中点击无效果。

7. <map>地图 z-index设置无效，自定义图标无效。

二、关于CSS

1. vertical-align控制垂直居中，在真机上可能会失效，多换换其它方法。

2.background-image慎用!!

三、关于JS

(和html一样，微信小程序也有自己的一套js架构，对于熟悉框架的人来说，应该不算陌生)

1. 没有window对象，基于它的所有框架或插件都不能用，包括jquery，因此不要操作dom，要操作data。

2. 接口请求使用https。

3. 数据不是双向绑定的，需要手动setData。

4.只有localStorage，没有sessionStorage。

5. 修改js文件，需要重启或重新编译才有效果。

四、微信开发者工具

1. 各种按钮点了经常没反应，要多点几次。

2. 有时报错，并不是代码有问题，重启编辑器就好了。

3. 不习惯白底黑字的皮肤，换自己的编辑器，识别不了wxml和wxss，要自己去设置。

4. 在控制台中不能直接编辑localStorage。

5... ...