让微信小程序页面隐藏滚动条

需求是隐藏页面的纵向滚动条，

小程序提供了视图容器 scroll-view ，可滚动视图区域。按文档中描述，需要两个条件：固定高度及scroll-y="true"

1、首先对于固定高度，需求是整页滑动，那么获取当前可使用窗口高度

wx.getSystemInfoSync().windowHeight  // 单位 px

当然为避免scroll-view滑动的时候带着整个页面滑动，固定高度值要比可使用窗口高度小一点，那么这样：

wxml:

<scroll-view  style="height:{{sHeight}};" scroll-y="true"></scroll-view>

js：

this.setData({
  sHeight: wx.getSystemInfoSync().windowHeight -1 + "px"
})

这时看页面效果，在安卓手机上，有大约1px宽度的滚动条

之后设置wxss隐藏滚动条即可

 ::-webkit-scrollbar {
  display:none;
  width:0;
  height:0;
  color:transparent;
}

此方法对android及iphone有效

觉得有用点个赞呗，比心心 ~ ( ´･ᴗ･` )ღ