微信小程序 scroll-view横向滚动,实现写法

一开始实现不了，搜的看了三四篇，并没觉得有什么用。也并没理解他们说的 跟inline-block影响很大；想了想竖向的原理，觉得应该这样，且已实现滚动。

直接代码(展示五个，超过五个滚动，这写死了)(这主要是在scroll-view的下一级元素 view class=flex-wrap 动态赋值宽度)：

	  
	    
	      菜单一
	    
	    
	      菜单二
	    
	    
	      菜单三
	    
	    
	      菜单四
	    
	    
	      菜单五
	    
	    
	      菜单六
	    
	  

Page({
	data: {
	    scrollWidth:0,
	    scrollLeftWidth:0,
	    windowWidth:0
	},
	onLoad:function(){
		var that = this;
		that.getScrollWidth();
	},
	getScrollWidth: function () {
	    var scrollWidth = wx.getSystemInfoSync().windowWidth;
	    this.setData({
	      scrollWidth: scrollWidth/5 * 6,
	      windowWidth: scrollWidth
	    })
	 },
	 scrollleft:function(e){
	    console.log(e);
	 },
	 lowerRight:function(e){
	    console.log(e);
	 },
})

.flex-wrap{
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
  height:40px;
}
.sertit-dis .flex-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

//滑动前（我原页面是有写好的模仿进度条，为了方便看，scroll-view上的事件都可触发，lowerRight，scrollleft）

//滑动后