微信小程序scroll-view的坑

2018-07-11  本文已影响106人  我叫Aliya但是被占用了

在scroll-view中不能使用flex布局!!!
在使用横向滚动时,发现不能滚动,解决方法:

scroll-view{
  display: block;
  overflow: scroll;
  white-space: nowrap; 
}
scroll-view item{
  display:inline-block;
}

scroll-left无效,没有找到解决办法,只是说不能全flex,可我并没有用

所以我用了scroll-into-view,它依然无效,网上的解决方法:
“不能全flex,要在组件渲染完成后,动态的改变(setData)这个scroll-into-view的值,才会跳到索引位置”
这个网上的方法是用来解决竖向滚动的,并没有解决我的问题

坑2 hidden

在flex布局中无效,鬼知道还会在哪里无效

坑3 组件样式

在组件名下写没有,要在 组件名 > 类名 下写

坑4 web-view

url有中文或标点、特殊符号,必须编码,否则空白页

坑4 判断h5是否在小程序环境内

官网给出的 window.__wxjs_environment === 'miniprogram' 在部分安卓机上失效

// 说明不在微信中 || 没有wx对像
    if (navigator.userAgent.indexOf('MicroMess') == -1 || !(wx && wx.miniProgram)) {
      // 走不在小程序的逻辑 
    } else {
      wx.miniProgram.getEnv(function(res) {
        if (res.miniprogram) {
          // 走在小程序的逻辑
        } else {
          // 走不在小程序的逻辑
        }
      })
    }
上一篇下一篇

猜你喜欢

热点阅读