更新记录

1.0.0（2020-10-21） 下载此版本

活动组件转盘整理

平台兼容性

小程序活动-转盘

兼容情况

项目有vue活动整改过来,主要以逻辑为主.后期UI和需求需自行修改原文件.

功能概要

• 可配置奖品文字
• 可配置转盘背景和抽奖指针
• 可配置本地奖品图片
• 奖品列表支持8个，可通过prizeNumber配置
• 可配置中奖ID

引入

<template>
    <view class="container">
        <jbdu-wheel :bgImg='bgImg' :btnImg='btnImg' :lucky='lucky' :datas='datas' :prizeNumber='prizeNumber'/>
    </view>
</template>

<script>
    import jbduWheel from "@/components/jbdu-wheel/wheel.vue";
    export default {
        components:{
            jbduWheel
        },
        data() {
            return {
                //  转盘背景
                bgImg:'https://dev.h5xy.uheixia.com/activity/wheel/static/img/zp.027bc93.png',
                //  转盘指针图片
                btnImg:'https://dev.h5xy.uheixia.com/activity/wheel/static/img/cjbtn.b814bb4.png',
                //  中奖ID
                lucky:1,
                //  转盘显示奖品个数
                prizeNumber:8,
                //  转盘奖品
                datas:[
                    {
                      id:1,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_sp.png',
                      name: "777金币"
                    },
                    {
                      id:2,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_lw.png',
                      name: "神秘大奖"
                    },
                    {
                      id:3,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_sp.png',
                      name: "300金币"
                    },
                    {
                      id:4,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_sp.png',
                      name: "碎片"
                    },
                    {
                      id:5,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_sp.png',
                      name: "168金币"
                    },
                    {
                      id:6,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/ic_dhw.png',
                      name: "再接再厉"
                    },
                    {
                      id:7,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_sp.png',
                      name: "88金币"
                    },
                    {
                      id:8,
                      img:'https://ss.bscstorage.com/wechat-huangwei/wannianli/wheel3x/qd_lw.png',
                      name: "幸运宝箱"
                    }
                ],
            }
        },
        methods: {

        }
    }
</script>

<style>
    .container {
        padding: 20px;
        font-size: 14px;
        line-height: 24px;
    }
</style>