更新记录

2.0.1（2023-04-06） 下载此版本

修复版本显示错误，修复配置说明。

1.1.6（2023-03-03） 下载此版本

更新文档。

2.0.0（2023-01-16） 下载此版本

增加概率配置。

平台兼容性

方便您的同时，请五星、收藏，让好的东西照亮更多深渊中负重前行的代码人。

创作不易，在您方便之际，赞赏作者，我们会更有动力继续下去。

简介

转盘抽奖。支持自定义盘面选项，灵活配置占比及奖品。

平台兼容性

全平台兼容。

快速开始

使用 uni_modules 安装（推荐）

使用 uni_modules 方式安装组件库，可以直接通过插件市场导入，通过右键菜单快速更新组件，不需要引用、注册，直接在页面中使用 ljs-turntable 组件。

参数

list 参数：

方法

快速应用

<template>
    <view class="content">
        <view class="openBut" @click="open()">打开转盘</view>
        <ljs-turntable
            :show="ljs_turntable_show"
            @getPrize="getPrize"
            @turntableState="turntableState"
            :probabilityTag="true"
            :list="list"/>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                ljs_turntable_show: false,
                list: [],
            }
        },
        onLoad() {
            // 最少3个选项
            // 最大值：12份，
            // 最小值：1份，
            // 每份10度
            this.list = [
                {
                    name: "Iphone 13",
                    prop: 2,
                    probability: 0.01, // 概率，所有项和必须等于1。
                    state: true, // 是否中奖
                    id: 1
                },
                {
                    name: "谢谢参与",
                    prop: 5,
                    probability: 0.27,
                    state: false, // 是否中奖
                    id: 5
                },
                {
                    name: "10个积分",
                    prop: 12,
                    probability: 0.3,
                    state: true, // 是否中奖
                    id: 3
                },
                {
                    name: "蓝牙耳机",
                    prop: 5,
                    probability: 0.02,
                    state: false, // 是否中奖
                    id: 5
                },
                {
                    name: "66个积分",
                    prop: 4,
                    probability: 0.1,
                    state: true, // 是否中奖
                    id: 4
                },
                {
                    name: "精美大礼包",
                    prop: 8,
                    probability: 0.3,
                    state: false, // 是否中奖
                    id: 5
                },
            ];
        },
        methods: {
            // 打开转盘
            open(){
                this.ljs_turntable_show = true;
            },
            // 回调，修改转盘的展示状态
            turntableState(val){
                this.ljs_turntable_show = val;
            },
            // 回调，转盘结果
            getPrize(state, id, prizeName){
                console.log(state, id, prizeName)
            },
        }
    }
</script>

<style lang="scss" scoped>
    .openBut{
        margin: 20upx;
        background-color: #007AFF;
        color: #FFF;
        width: 200upx;
        height: 60upx;
        line-height: 60upx;
        text-align: center;
        border-radius: 10upx;
    }
</style>

贡献代码

龙九山。有任何问题，请在平台留言，在手头宽裕得情况下，我会尽快修复问题。