wx-mini-weview/components/swiper-item/swiper-item.js

weixin UI

Component({
  options: {
    styleIsolation: 'apply-shared',
    multipleSlots: true
  },

  relations: {
    '../swiper/swiper': {
      type: 'parent'
    }
  },

  properties: {
    // 标识符，可以是字符串或数字
    name: {
      type: String,
      value: ''
    },
    // 自定义类名
    customClass: {
      type: String,
      value: ''
    }
  },

  data: {
    // 是否为当前显示的项
    active: false,
    // 在swiper中的索引
    index: -1,
    // 位置样式，由父组件设置
    style: ''
  },

  lifetimes: {
    attached() {
      // 如果没有设置name，自动生成随机name
      if (!this.data.name) {
        const randomName = 'swiper_item_' + Math.floor(Math.random() * 10000);
        this.setData({
          name: randomName
        });
      }
    }
  },

  methods: {
    // 更新激活状态
    updateActive(active, index) {
      if (this.data.active !== active || this.data.index !== index) {
        this.setData({
          active,
          index
        });
      }
    },

    // 更新位置样式
    updateStyle(style) {
      this.setData({ style });
    }
  }
});