😍 分享一个前端 [大转盘 / 九宫格] 抽奖插件 ☜(ﾟヮﾟ☜)
ldq404 · buuing · 2021-01-20 16:59:14 +08:00 · 3915 次点击这是一个创建于 1395 天前的主题，其中的信息可能已经有所发展或是发生改变。
抽奖插件
🎨 奖品 / 文字 / 图片 / 颜色 / 按钮均可配置
🚦 支持同步 / 异步抽奖
🎯 概率前 / 后端可控
🎈 自动根据 dpr 调整清晰度适配移动端
- 文档：100px.net
- Github：github.com/luckdraw
各端兼容情况
| npm 包 | 支持的框架 | 最新版本 | 下载量（月） | Star |
| lucky-canvas | Js / JQuery |  |
 |
 |
| vue-luck-draw | Vue2.x / Vue3.x |  |
 |
 |
| react-luck-draw | React | 开发中... | ||
| mini-luck-draw | 原生微信小程序 |  |
 |
 |
| taro-luck-draw | taro | 计划中... | ||
| uni-luck-draw | uni-app |  |
 |
 |
- 后期会增加更多功能 / 属性, 以及更多抽奖类型 (老虎机 / 扭蛋机 / 刮刮乐), 以及更多端的兼容
- 如果哪位老哥想要的功能没有, 也可以留言发给我
本插件开源免费，用着顺手的小伙伴可以 github 点个star支持一下 (●'◡'●)
第 1 条附言 · 2021-01-20 18:08:05 +08:00
首先感谢大家的支持, 我再补充两个 demo 🤣市面上你能看到的抽奖 99% 都可以实现, 如果不能实现请联系我, 我给你加功能
-
ps: 图片 demo 基于 github 托管, 如果图裂了, 你可以去官网示例中自行观赏这几个 demo
-
demo 示例: https://100px.net/demo/wheel/xc.html
第 2 条附言 · 2021-02-03 17:27:02 +08:00
新增 React 和 Taro 两个版本抽奖, 持续更新中~~~
| npm 包 | 支持的框架 | 最新版本 | 下载量（月） | Star |
| react-luck-draw | React |  |
 |
 |
| taro-luck-draw | Taro |  |
 |
 |
 |
1
ARhen 2021-01-20 17:08:55 +08:00  1
自己做自己的欧皇 😂
|
 |
3
justin2018 2021-01-20 17:28:30 +08:00 1
可以 可以
颜值很好 收藏了 哈哈哈~ |
 |
4
TabGre 2021-01-20 17:40:09 +08:00 via iPhone 1
nice
|
 |
5
ldq404 OP @justin2018 额, 老哥, 具体样式得由公司的 ui 来设计, 我只提供插件 🤣
|
 |
6
nasa 2021-01-20 17:48:23 +08:00 1
start 已送上
|
 |
8
lichdkimba 2021-01-20 17:58:38 +08:00 1
支持 真的做的可以
|
 |
9
dioxide 2021-01-20 18:04:03 +08:00 1
不错, 感谢分享,
|
|
10
ldq404 OP @lichdkimba 嘿嘿, 谢谢夸奖 😁
|
 |
11
baozi23 2021-01-20 19:40:34 +08:00 1
是不是可以加个配置 12 宫格的，或者能够自定义配置宫格数量
|
|
12
ldq404 OP @baozi23 有的, 可以通过`rows`和`cols`这两个属性, 默认是 3*3 的九宫格, 然后格子可以通过 row 或 col 设置合并单元格实现`m*n`宫格 😎
|
 |
13
JokerLiang 2021-01-21 10:18:05 +08:00 1
不错，推荐，用了这个做了个需求。感谢老哥。
|
 |
14
oneisall0423 2021-01-21 10:55:14 +08:00 1
支持一下~
|
|
15
ldq404 OP @JokerLiang 哈哈哈, 好巧啊 😂
|
 |
16
imtudou 2021-01-21 16:35:42 +08:00 1
Mark 支持一下~
|
 |
18
hitaoguo 2021-01-22 09:31:15 +08:00 1
再写个抽人的，就齐活了
|
 |
21
Serializability 2021-01-22 17:30:10 +08:00 1
好东西，start 已点
|
|
22
ldq404 OP @Serializability 谢谢支持😎
|
 |
24
rodrick 2021-01-23 08:25:53 +08:00 1
不错不错，star 一下
|
|
25
rodrick 2021-01-23 08:31:35 +08:00
不知道是不是我网的问题，现在所有用 github page 的访问都好卡啊。。
|
 |
26
90d0n 2021-01-23 11:32:54 +08:00 1
不错不错, 做的很棒!
可不可以支持一次抽奖,多个中奖奖品. 比如 点击一次抽奖获得两个奖品 |
|
28
ldq404 OP @90d0n 大转盘肯定搞不了, 九宫格的话还可以, 但是总共也就 8 个奖品, 同时抽三四个会显得太乱了, 不过倒是可以搞一个 10 连抽的功能, 抽中一个继续抽下一个😎
|
 |
29
lcf8381595 2021-01-23 16:50:19 +08:00 1
谢谢。正好要用。请问能支持其它类型的抽奖吗？比如一个产品，抽奖结果只有两种情况，中奖和未中奖（根据提前设置好的中奖率），这种需求怎么实现比较好？
|
|
30
ldq404 OP @lcf8381595 目前只搞了大转盘和九宫格, 你说的这种我也没没啥思路, 直接给个翻转卡片得了
|
Select Language