摘要：需求总是很紧急，昨天正在开会收到人力需求，有时间做个抽奖吗下午四点，年会五点开始。好了不扯淡了开始干活吧先屡一下思路好看是好看不了了，别指望没设计没时间程序员搞出来的效果。样式开始按钮停止按钮人员名单别列表抽中名单列表。
需求总是很紧急，昨天正在开会收到人力需求，有时间做个抽奖吗?（now 下午四点12，年会五点开始。）还没能等我拒绝，人事又补了一句做不出来我们就不抽奖了，我擦瞬间感觉要是搞不出来会被兄弟们捅死的节奏，默默的删除了没时间做的消息，重新写了四个字名单给我。
还好去年前年都是我搞得很庆幸没被当场打脸，重启去年程序（需要收集全员头像并ps）时间显然不够，庆幸的是还有点经验，会议结束时间已经四点半了。
好了不扯淡了开始干活吧！
先屡一下思路1、好看是好看不了了，别指望没设计没时间程序员搞出来的效果。
2、样式开始按钮、停止按钮、人员名单别列表、抽中名单列表。
3、点击开始，首先乱序名单列表保证每次抽奖列表顺序不一样，防止他们怀疑我作弊搞权重（就TM半小时哪有时间搞权重）时间紧任务重，直接用的lodash shuffle方法来乱序视图
4、随机数是肯定要有的，每隔200ms随机一个从0到人员个数（数组长度随机整数）
5、抽中人员和没抽中人员分两个数组存入localStorage，防止抽奖过程中刷新页面，纯静态不存本地那场面就尴尬了每次刷新完如果本次存储了从本地获取人员列表和中奖名单
6、点击end选中当前随机数在页面上高亮显示。
接下来看整体实现代码
2019抽奖程序
{{item}}
{{ item }}
体验下效果
需求搞定，经现场测试目前没发现什么问题！如有疑问随时回复留言！
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/108978.html
摘要：总是看到类似的九宫格抽奖效果后来想自己手撸一个试一试吧。多多尝试万一成功了呢先来总结一下效果类似与跑马灯效果，闪动效果先快后慢。 总是看到类似的九宫格抽奖效果,后来想自己手撸一个试一试吧。(多多尝试,万一成功了呢 github L6zt) 先来总结一下效果,类似与跑马灯效果，闪动效果先快后慢。代码解析如下所示：代码 0 ...
摘要：总是看到类似的九宫格抽奖效果后来想自己手撸一个试一试吧。多多尝试万一成功了呢先来总结一下效果类似与跑马灯效果，闪动效果先快后慢。 总是看到类似的九宫格抽奖效果,后来想自己手撸一个试一试吧。(多多尝试,万一成功了呢 github L6zt) 先来总结一下效果,类似与跑马灯效果，闪动效果先快后慢。代码解析如下所示：代码 0 ...
摘要：围绕以太坊的开发生态是目前相对最成熟的，比如有开发框架，有智能合约在线集成开发环境，还有专设的开发者问答频道。 showImg(https://segmentfault.com/img/bVbaJOL?w=1200&h=514); 张泉灵说，时代抛弃我们的时候连声再见都不会说，马云说对于新兴事物，绝大多数人是看不见、看不起、看不懂、来不及。自从学完 Coursera 上的 Crypto...
摘要：围绕以太坊的开发生态是目前相对最成熟的，比如有开发框架，有智能合约在线集成开发环境，还有专设的开发者问答频道。 showImg(https://segmentfault.com/img/bVbaJOL?w=1200&h=514); 张泉灵说，时代抛弃我们的时候连声再见都不会说，马云说对于新兴事物，绝大多数人是看不见、看不起、看不懂、来不及。自从学完 Coursera 上的 Crypto...
阅读 1776·2019-08-30 15:53
阅读 3084·2019-08-30 15:44
阅读 2744·2019-08-26 13:31
阅读 1917·2019-08-26 12:10
阅读 745·2019-08-26 11:01
阅读 2060·2019-08-23 15:32
阅读 1513·2019-08-23 13:43
阅读 2490·2019-08-23 11:58
