小程序scroll-view

 

 

写一个简单的小程序scroll-view 的横向排列样式

不知道为什么，好像scroll-view 不支持弹性布局，我也不知道是我的写法的问题还是什么原因。

还是利用display: inline-block; 才让view 同行的。

css:

.sv{
  width:100%;
  white-space: nowrap;
  border: 1rpx solid blue;

}
.nv{
  width: 20%;
  height: 100rpx;
  display: inline-block;
  line-height: 100rpx;
  text-align: center;
  border-right: 1px solid #c7c7c7;
}

 wxml：

<scroll-view scroll-x="true" class='sv'>
  <view wx:for="{{list2}}" class='nv'>
  {{item.name}}
  </view>

</scroll-view>

至于js数据，自己随便写就行了

样式简单，但是可以滑动，自己修改一下就可以使用了。