小程序｜swiper-view左右滑动效果实现

<view>
    <scroll-view class="scroll" scroll-x style="width: 100%"  scroll-into-view="{{toView}}">
        <view wx:for="{{list}}" data-item='{{item}}' wx:for-item="item" class='item' bindtap="tap" id="{{item.name}}">
        {{item.name}}
        </view>
    </scroll-view>
</view>

.scroll {
    white-space: nowrap;    /*重点*/
}
.item {
    display: inline-block;    /*重点*/
    padding: 20rpx 35rpx;
    border: 1rpx solid red;
}

Page({
  data: {
    toView: 'a0',   /* 不能用数字，建议用字符串 */
    list: [
      {id: 1, name: 'a1'},
      {id: 2, name: 'a2'},
      {id: 3, name: 'a3'},
      {id: 4, name: 'a4'},
      {id: 5, name: 'a5'},
      {id: 6, name: 'a6'},
      {id: 7, name: 'a7'},
      {id: 8, name: 'a8'},
    ]
  },
  tap: function(e) {
    let id = e.target.dataset.item.id
    const to = 'a' + (id - 1)
    console.log(to)
    this.setData({
      toView: to
    })
  }
})

结束！！！