vue-lottery-draw

vue-lottery-draw 参考组件 vue-lottery 在基础上扩展奖品图片、名称、数量根据后台数据返回 组件样式可配置

Build Setup

ES6

npm install vue-lottery-draw --save
import vueLotteryDraw from 'vue-lottery-draw'
Vue.use(vueLotteryDraw)

调用示例

<vue-lottery-draw @lotteryClick="lotteryClick" @lotteryDone="lotteryDone" :lottery-start="lotteryStart" :lottery-prizenum="prizeNum" :lottery-prizeno="prizeNo" :prize-list="prizeListCom" lottery-bg="./static/lotteryprobg.png" pointer-bg="./static/pointer.png" />

props说明

| 参数名 | 参数类型 | 解释 | 是否必传 | | :--- | :--- | :--- | :--- | | lottery-prizenum | Number | 奖品总数量 | 是 | | lottery-prizeno | Number | 从起点开始逆时针算，中奖的是第几个 | 是 | | lottery-bg | String | 内容区域背景图 | 是 | | prize-list | String | 奖品数组后台返回的 | 是 | | pointer-bg | String | 指针背景图 | 是 | | lottery-class| String | 自定义class | 否 | | lottery-start | Number | 0为停止，1为开始转动 | 否 | | lotteryDone | Function | 旋转完成后的回调函数 | 否 | | lotteryClick | Function | 点击抽奖按钮的回调 | 否 |