更新记录

1.0（2023-08-27） 下载此版本

无

平台兼容性

uni-app

代码示例

注意：插件包含正反面图片请自行替换谢谢。

<xzl-kapai ref="kapai" :card="card" :extractNum="extractNum" @success="success">
</xzl-kapai>
<button @click="playStart">点我开始抽奖</button>

export default {        

    data() {
        return {
                        card: [
                {
                    val: '分配老婆',
                    status: 0
                },
                {
                    val: '分配孩子',
                    status: 0
                },
                {
                    val: '我要当机器人',
                    status: 0
                }
                {
                    val: '送一巴掌',
                    status: 0
                },
                {
                    val: '喜提劳斯莱斯',
                    status: 0
                },
                {
                    val: '买车送房',
                    status: 0
                }
                {
                    val: '一个亿',
                    status: 0
                },
                {
                    val: '保送清华',
                    status: 0
                },
                {
                    val: '保送北大',
                    status: 0
                }
            ],

        }
    },
    methods:{
            playStart(){
            this.card.map(i => {
                    i.is_move = true //执行洗牌动画
            })
            this.$nextTick(() => {
                this.$refs.kapai.start(this.card, (end) => {
                        console.log('洗牌结束了');
                })
            })
            },
            success(e) {
                        const {
                            item,
                            index
                        } = e.detail;
                        var obj = this.card[index];
                        obj.status = 1;
                        this.card[index] = obj;

                        uni.showModal({
                            title: '抽奖结果',
                            content: '恭喜您，获得了' +
                                `【${obj.val}】`,
                            confirmText: '立即使用',
                            cancelText: '继续抽奖',
                            success: (res) => {
                                if (res.confirm) {

                                } else {

                                }
                            }
                        });

                    },
            }

}