微信小程序-scroll-view左右滑动

效果：

wxml页面：

对应的wxss:

.section{
  width: 100%;
  margin-top:10px;
}

.scroll-view_H{
  height:210rpx;
  display: flex;
  width: 100%;
  white-space: nowrap;

}
.scroll-view-item_H{
  width:300rpx;
  height:210rpx;
  margin-right:5rpx;
  display: inline-block;

}
.scroll-image{
  width:300rpx;
  height:210rpx;
  display: block;
  border-radius: 10px
}

对应的JS：在data中定义对象

 hotList: [
      {
        pic: "../../images/lunbo/1.jpg",
      },
      {
        pic: "../../images/lunbo/2.jpg",
      },
      {
        pic: "../../images/lunbo/3.jpg",
      },
      {
        pic: "../../images/lunbo/4.jpg",
      }
    ],