1. 中文图片路径问题
当图片名为中文的时候,在开发者工具上,Iphone设备,或用于底部Tab栏上,显示正常。在安卓设备且用于页面中是,图片网址返回404错误(要手动binderror并打印事件才能发现)。
建议:自动log这些错误。
2. 开发者工具缩放问题
(2017/3/7提出,2017/8/6更新时已解决,目前无法缩放)
开发者工具中,按CTRL加滚轮是会缩放的,而且不知道缩放比是多少,而且预览内容不会缩放,但是框会(放大试试就知道)。当发现内容怎么都不能居中时,可能就是预览框缩小了,挡住了一部分页面。
建议:工具角落显示当前缩放比。
3. wxml文字居中解析问题
对于这么一段代码:
<text>
中
</text>
如果我希望text
固定高宽,中
字居中,类似象棋之类的效果,那么我的WXSS可能是这样的:
text {
height: 30rpx;
width: 30rpx;
border: 3rpx solid black;
border-radius: 30rpx;
font-size: 30rpx;
line-height: 30rpx;
text-align: center; /* 对多个字时有效 */
/* 以及其他一些操作 */
}
在PC端的小程序开发工具上,它显示为一个直径为30rpx的、3prx粗黑边的圆,里面端端正正放着一个“中”字。但是呢,在IOS端上,“中”字莫名其妙往右偏移了一块。起初我以为是我布局方式不兼容,于是换成了子元素relative/absolute或flex布局都于事无补。
最后才发现,原来在IOS端的小程序上,代码里,“中”字那行前面的缩进空格被解析成一个空格字符,把显示的“中”字挤到旁边,导致怎么都无法居中文字的问题。
知道了问题所在,那么解决方式也就显而易见了。对那些不能出现空格的节点,将它的起始标签、内容、结束标签放到同一行,不给它留机会。(因为\n
也是空白字符的一种)
同理,对于多个元素中间出现蜜汁gap的问题,也可能是这个问题导致的。
希望这篇文章不再更新。 [\掩面](打出GG)
4. require和代码保护(2019/09更新)
有时候在“预览”模式中,require到的对象为空,除了排除循环require的问题以外,还要看看有没有启动“代码保护”功能(如图)。
如果代码中有变量用require
命名,启动代码保护时有可能会出错,而且只在“预览”时会出错,“真机调试”和开发者工具都不会报错。官方文档也有提到:
希望这篇文章不再更新。 [\掩面](再次打出GG)