微信小程序——走过的坑

1.text标签

text标签

• 不能设置width

• wxml使用多个空格（&nbsp；），要添加 decode=’{{decode}}’

  js文件中设置decode为true

  data: { decode:true, },

2.wxss设置page整个页面的背景色

page{
    background-color: #F2F2F2;
    width:100vw;
    height:100vh;
  }
           

3.onShow()与onLoad()

bug： 在onShow()中执行this.onLoad()，会导致页面第一次加载的时候数组加载两次！

造成原因：页面加载先执行onLoad，再执行的onShow，就会出现在onLoad加载一次数据，在onShow中执行this.onLoad()在加载一次数据。

解决办法：将不需要刷新的数据放在onLoad中执行，将需要刷新的数据放在onShow中执行。

4.时间格式化

if (res.statusCode == 200 && res.data.total > 0) {
	          for (var i = 0; i <= res.data.list.length; i++) {
	            var dateFormat = res.data.list[i].start_time
	            res.data.list[i].start_time = ts.dateTimeFormat(dateFormat)
	            ts.setData({
	              cars: res.data.list,
	              show: true,
	            })
	          }         
	        }
        
 dateTimeFormat: function (dateTime){
    if (dateTime && dateTime.length === 14) {
      var time = '';
      time = dateTime.substring(0, 4) + '-' + dateTime.substring(4, 6) + '-' + dateTime.substring(6, 8) + ' ' + dateTime.substring(8, 10) + ':' + dateTime.substring(10, 12) + ':' + dateTime.substring(12, 14);
      return time;
    }
  }, 
           

5.前端获取的时间undefined，解决方法

var dataFormat = JSON.stringify(res)
           

6.解决calc失效问题

“减号”左右，一定要有空格

width: 100vw;
  height: calc(100vh - 8rpx);
           

7.去掉右侧超出页面的滚动条

/* 去掉默认滚动条 */
::-webkit-scrollbar{
width: 0;
height: 0;
color: transparent;
}
           

如果失效，加上

page {
  width: 100vw;
  height: 100vh;
}
           

8.图片在安卓机上不显示，ios正常显示的问题

解决：图片的命名不能存在空格