game-swiper2

组件

安装

npm install game-swiper2

使用

• json

{
    "usingComponents": {
        "swiper2": "game-swiper2/index"
    }
}

• js

Page({
  data: {
    autoTime: 0,//自动播放时间，如果小于等于0，就不自动播放
    fontSrc: "",
    imgData: [
      { src: "https://cloud.video.taobao.com//play/u/2185320355/p/1/e/6/t/1/419438668768.mp4", poster: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN017PmaYZ1FJvoyet5Bm_!!1080040467.jpg", type: "video", title: "生活艺术系列", desc: "路易威登倾情呈现，包括多种经典生活系列，", logo: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01ZW6qZg1FJvpKCBcWo_!!1080040467.png", zanNum: "2423", },
      { src: "https://cloud.video.taobao.com//play/u/907349826/p/1/e/6/t/1/259123106065.mp4", poster: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN017PmaYZ1FJvoyet5Bm_!!1080040467.jpg", type: "video" },
      { src: "https://cloud.video.taobao.com//play/u/907349826/p/1/e/6/t/1/258904832193.mp4", poster: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN017PmaYZ1FJvoyet5Bm_!!1080040467.jpg", type: "video" },
      { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN017PmaYZ1FJvoyet5Bm_!!1080040467.jpg" },
      { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01c8lqz41FJvnKS0gWz_!!1080040467.png" },
    ]
  },
  onInitDone(ref) {
    this.swiper = ref;
  },
  onCallback(item) {
    // 卡片点击回调
    // {item:对应imgData元素，rect:位置信息}
    console.log("点击回调：", item)
  },
  onChange(id) {
    console.log("切换回调：", id)
  },
});

• xaml

  <swiper source="{{imgData}}" fontSrc="{{fontSrc}}" autoTime="{{autoTime}}" onInitDone="onInitDone" onChange="onChange" 
    onCallback="onCallback">
    <view slot="item0">1w+</view>
    <view slot="item1">2w+</view>
    <view slot="item2">3w+</view>
    <view slot="item3">4w+</view>
  </swiper>