buuing / lucky-canvas

🎖🎖🎖 基于 TS + Canvas 开发的【大转盘 / 九宫格 / 老虎机】抽奖插件,🌈 一套源码适配多端框架 JS / Vue / React / Taro / UniApp / 微信小程序等,🎨 奖品 / 文字 / 图片 / 颜色 / 按钮均可配置,支持同步 / 异步抽奖,🎯 概率前 / 后端可控,🚀 自动根据 dpr 调整清晰度适配移动端

Home Page:https://100px.net

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

uniapp 使用大转盘编译到 微信小程序,点击抽奖按钮,转盘不懂转动,但是开始抽奖函数调用了,结束的时候也回调了

benweng opened this issue · comments

-当前是什么框架:uniapp

-使用的包:@lucky-canvas/uni

-当前插件的版本:0.0.10

  • 当前环境是:小程序

-详细描述的bug:
uniapp 使用大转盘编译到 微信小程序,点击抽奖按钮,转盘不懂转动,但是开始抽奖函数调用了,结束的时候也回调了

  • 问题代码:
<template>
    <lucky-wheel width="438rpx" height="438rpx" ref="turntable" :blocks="turntable.blocks" :prizes="turntable.prizes" :buttons="turntable.buttons" @start="startLottery" @end="endLottery"></lucky-wheel>
</template>
<script>
    import LuckyWheel from '@/components/@lucky-canvas/uni/lucky-wheel';
    export default {
        components: { 'lucky-wheel':LuckyWheel},
        data(){
                return {
                    turntable:{
                        blocks:[{imgs:[{src:uni.getStaticPath('m1-3-1.png'),width:"438rpx",height:"438rpx"}]}],
                        prizes:[
                            {text:'奖品1',lottery_id:1},
                            {text:'谢谢参与',lottery_id:4},
                            {text:'奖品2',lottery_id:2},
                            {text:'奖品3',lottery_id:3},
                            {text:'谢谢参与',lottery_id:4},
                            {text:'奖品2',lottery_id:2}
                        ],
                        buttons:[
                            {
                                pointer:true,
                                radius:"90rpx",
                                imgs:[{src:require("@/static/images/btn-lottery-index.png"),top:"-98rpx",width:"160rpx",height:"180rpx"}]
                            }
                        ]
                    }
                }
        },
        methods:{
            /* 开始抽奖 */
            startLottery(){
                // 先开始旋转
                this.$refs.turntable.play();
                uni.sleep(2000).then(()=>{
                    this.$refs.turntable.stop(2);
                });
            },
            /* 结束抽奖 */
            endLottery(prize){
                // 奖品详情
                console.log(prize)
            }
        }
    }
</script>