更新记录

1.5.1（2024-07-23） 下载此版本

更新使用说明

1.5.0（2024-07-23） 下载此版本

跟新使用文档

1.4.9（2024-05-31） 下载此版本

添加最新的使用示例

平台兼容性

zf-turntable-box

如果该插件对您有帮助，麻烦收藏评价鼓励一下作者

props参数说明

使用示例

<template>
  <view>
    <zf-turntable-box
      ref="turntableRef"
      @chooseFn="chooseFn"
      :isClick="isClick"
      :cjMap="list"
      :chooseIndexDefalt="chooseIndexDefalt"
    ></zf-turntable-box>
  </view>
</template>
<script setup>
import { ref } from "vue";
// 奖项集合
const list = ref([
  { icon: "./icon1.png", desc: "3个月VIP", type: 1 },
  { icon: "./icon2.png", desc: "一件T桖", type: 1 },
  { icon: "./icon3.png", desc: "一个背包", type: 1 },
  { icon: "./icon4.png", desc: "一个杯子", type: 1 },
  { icon: "./icon5.png", desc: "谢谢参与", type: 1 },
  { icon: "./icon6.png", desc: "书一本", type: 1 },
  { icon: "./icon7.png", desc: "40元代金券", type: 1 },
  { icon: "./icon8.png", desc: "一个鼠标", type: 1 },
]);
const turntableRef = ref(null);
// 是否可以点抽奖按钮
const isClick = ref(true);
//这里是后端返回的奖项集合中能够中奖的集合中中奖的下标;
const chooseIndexDefalt = ref(0);
// 接受抽奖后传递抽中的值
const chooseFn = (e) => {
  //抽奖结束后禁用抽奖按钮功能//isClick.value = false
  console.log(e);
  uni.showToast({
    title:JSON.parse(e).desc,
    icon:'none'
  })
};
</script>