game-swiper1 v0.0.15

game-swiper1

组件

安装

npm install game-swiper1

使用

• json

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

• js

Page({
  data: {
    autoTime: 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", isActive: true, title: "古驰奢品NFT", desc: "古驰藏宝阁的节日奇迹", zanNum: "1w+" },
      { 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>