vue组件实现移动端九宫格转盘抽奖

本文实例为大家分享了vue组件实现移动端九宫格转盘抽奖的具体代码,供大家参考,具体内容如下 vue-lucky-draw 移动端九宫格转盘抽奖vue组件,中奖的奖品数据由接口决定。 效果图 抽奖 因为中奖的结果是后台返回的,所以要考虑转盘的最终停下来的位置必须是在对应后台返回结果的奖品的位置,也就是要模拟出这个中奖的过程(所以所谓的抽奖都是骗人的,嘿嘿)。先要写出移动的背景框对应的各个位置的css,然后动态切换class来使其呈现出转动效果。明白了过程就好写了。 中间的按钮用的是css3的animation,我这个奖品是合在了一张图上,你也可以分开成8张小图,那样需要写更多的样式。 //