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

效果演示


    
        
        {{item.name}}
        
    

.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
    })
  }
})

结束!!!

你可能感兴趣的:(小程序)