{"owner":"buuing","repo":"lucky-canvas","hasSkills":true,"totalSkillsCount":7,"totalTokensCount":6476,"categories":["root-instruction","plugin-manifest"],"hasMcp":false,"mcpConfig":null,"found":["AGENTS.md","packages/core/README.md","packages/mini/README.md","packages/react/README.md","packages/taro/README.md","packages/uni/README.md","packages/vue/README.md"],"skills":{"AGENTS.md":"# Git 提交约定\n\n- 每次完成一个需求后，使用中文自动创建一次 Git commit，并遵循 Conventional Commits 格式。\n- 提交信息使用 `type: 中文描述` 的格式；新增功能使用 `feat:`，维护规范或构建配置使用 `chore:`，修复问题使用 `fix:`。\n\n# 代码修改前提\n\n- 每次开始改代码前，必须确保已充分理解需求和相关上下文；若上下文不足，不得直接修改代码。\n\n# 旧官网文档\n\n- 旧的官网文档位于与 `lucky-canvas` 同一层级的 `100px.net` 目录。\n","packages/core/README.md":"\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net/usage/js.html](https://100px.net/usage/js.html)  \n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n\n\n<br />\n\n## 在 JS / TS 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/js.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n","packages/mini/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>微信小程序 抽奖组件</h1>\n  <p>一个基于微信小程序的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 文档 - Document\n\n- **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 使用 - Usage\n\n- [**在 微信小程序 中使用**](https://100px.net/usage/wx.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/react/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 在 React 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/react.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/taro/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>@lucky-canvas/taro 抽奖插件</h1>\n  <p>一个基于 Taro 的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/LuckDraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net/usage/taro.html](https://100px.net/usage/taro.html)\n\n<br />\n\n## 在 Taro 中使用\n\n### 安装\n\n> 为了确保相关依赖安装正确, 你必须通过 npm / yarn 来安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/taro@latest\n\n# yarn 安装：\nyarn add @lucky-canvas/taro@latest\n```\n\n\n<br />\n\n### 使用\n\n#### taro-vue 简单示例\n\n- [点击查看 taro-vue 完整示例](https://100px.net/usage/taro.html)\n\n```html\n<template>\n  <view>\n\n    <!-- 大转盘抽奖 -->\n    <LuckyWheel width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 九宫格抽奖 -->\n    <LuckyGrid width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 老虎机抽奖 -->\n    <SlotMachine width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n  </view>\n</template>\n\n<script>\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/vue'\nexport default {\n  components: { LuckyWheel, LuckyGrid, SlotMachine },\n}\n</script>\n```\n\n<br />\n\n#### taro-react 简单示例\n\n- [点击查看 taro-react 完整示例](https://100px.net/usage/taro.html)\n\n```js\nimport React from 'react'\nimport { View } from '@tarojs/components'\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/react'\n\nexport default class Index extends React.Component {\n  render () {\n    return <View>\n\n      {/* 大转盘抽奖 */}\n      <LuckyWheel width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 大转盘抽奖 */}\n      <LuckyGrid width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 老虎机抽奖 */}\n      <SlotMachine width=\"300px\" height=\"300px\" ...你的配置 />\n\n    </View>\n  }\n}\n```\n\n<br />\n\n## 完整文档: https://100px.net\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜) ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/uni/README.md":"<br />\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n\n|适配框架|npm下载量|CDN使用量|\n| :-: | :-: | :-: |\n|[`JS` / `JQ` 中使用](https://100px.net/usage/js.html)|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|[`Vue` 中使用](https://100px.net/usage/vue.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|[`React` 中使用](https://100px.net/usage/react.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`UniApp` 中使用](https://100px.net/usage/uni.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`Taro3.x` 中使用](https://100px.net/usage/taro.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`微信小程序` 中使用](https://100px.net/usage/wx.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net](https://100px.net)\n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n  \n<br />\n\n## 在 uni-app 中使用\n\n### 1. 安装插件\n\n- 你可以选择通过 `HBuilderX` 导入插件： [https://ext.dcloud.net.cn/plugin?id=3499](https://ext.dcloud.net.cn/plugin?id=3499)\n\n- 也可以选择通过 `npm` / `yarn` 安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/uni\n\n# yarn 安装：\nyarn add @lucky-canvas/uni\n```\n\n<br />\n\n### 2. 引入并使用\n\n```html\n<view>\n  <!-- 大转盘抽奖 -->\n  <LuckyWheel\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n  <!-- 九宫格抽奖 -->\n  <LuckyGrid\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n</view>\n```\n\n```js\n// npm 下载会默认到 node_modules 里面，直接引入包名即可\nimport LuckyWheel from '@lucky-canvas/uni/lucky-wheel' // 大转盘\nimport LuckyGrid from '@lucky-canvas/uni/lucky-grid' // 九宫格\n\n// 如果你是通过 HBuilderX 导入插件，那你需要指定一下路径\n// import LuckyWheel from '@/components/@lucky-canvas/uni/lucky-wheel' // 大转盘\n// import LuckyGrid from '@/components/@lucky-canvas/uni/lucky-grid' // 九宫格\n\nexport default {\n  // 注册组件\n  components: { LuckyWheel, LuckyGrid },\n}\n```\n\n<br />\n\n### 3. 我提供了一个最基本的 demo 供你用于尝试\n\n由于 uni-app 渲染 md 的时候会出问题，所以我把 demo 代码放到了文档里\n\n- [https://100px.net/usage/uni-app.html](https://100px.net/usage/uni-app.html)\n\n<br />\n\n### **4. 补充说明**\n\n- [**如果用着顺手, 可以在 Github 上面点个 <img height=\"22\" align=\"top\" src=\"https://img.shields.io/github/stars/buuing/lucky-canvas\" /> 支持一下(●'◡'●)**](https://github.com/buuing/lucky-canvas)\n\n- 另外: 如果你修复了某些bug或兼容, 欢迎提给我, 我会把你展示到官网的贡献者列表当中\n\n\n<br />\n\n### 5. 常见问题\n\n1. 转盘层级太高了, 我的弹窗盖不住怎么办?\n\n> 答: 因为小程序里canvas是原生组件顶层渲染, 我无法控制canvas的层级, 如果你想盖住它也肯简单, 你可以百度搜索`<cover>`组件\n\n2. 你这些素材, 图片组件从哪下载?\n\n> 答: 官网里的任何图片素材, 所使用到的图片资源均为学习交流使用, 请勿将其用于商业用途, 由此产生的任何商业纠纷我这边概不负责\n\n3. xxx属性怎么使用? xxx方法怎么调用?\n\n> 答: 自己去看文档, 不然难道要我把代码给你写好吗?\n\n4. 这个属性的效果与官网的描述不一致?\n\n> 答: 可能有bug, 你可以去github上的issues去提问 (请认真填写模板)\n\n5. 为什么这个插件不支持app和其他小程序\n\n> 答: 没时间, 但是希望志同道合的同学来一起参与uniapp的兼容开发\n\n---\n\n<font color=\"blue\">作者留言: 为了使我自己保持心情愉悦, 低于5星的提问我用浏览器插件都屏蔽了</font>\n\n<font color=\"green\" size=\"50\">不要通过插件市场赞赏!!!</font>\n","packages/vue/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/luckdraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<div align=\"center\">\n\n|适配框架|npm包|最新版本|npm下载量|CDN使用量|\n| :-: | :-: | :-: | :-: | :-: |\n|`JS` / `JQ`|[lucky-canvas](https://100px.net/usage/js.html)|<img src=\"https://img.shields.io/npm/v/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|`Vue2.x` / `Vue3.x`|[@lucky-canvas/vue](https://100px.net/usage/vue.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|`React`|[@lucky-canvas/react](https://100px.net/usage/react.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`UniApp`|[@lucky-canvas/uni](https://100px.net/usage/uni.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`Taro3.x`|[@lucky-canvas/taro](https://100px.net/usage/taro.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`微信小程序`|[@lucky-canvas/mini](https://100px.net/usage/wx.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n</div>\n\n<br />\n\n## 在 vue2.x / vue3.x 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/vue.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n"},"files":{"AGENTS.md":"# Git 提交约定\n\n- 每次完成一个需求后，使用中文自动创建一次 Git commit，并遵循 Conventional Commits 格式。\n- 提交信息使用 `type: 中文描述` 的格式；新增功能使用 `feat:`，维护规范或构建配置使用 `chore:`，修复问题使用 `fix:`。\n\n# 代码修改前提\n\n- 每次开始改代码前，必须确保已充分理解需求和相关上下文；若上下文不足，不得直接修改代码。\n\n# 旧官网文档\n\n- 旧的官网文档位于与 `lucky-canvas` 同一层级的 `100px.net` 目录。\n","packages/core/README.md":"\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net/usage/js.html](https://100px.net/usage/js.html)  \n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n\n\n<br />\n\n## 在 JS / TS 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/js.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n","packages/mini/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>微信小程序 抽奖组件</h1>\n  <p>一个基于微信小程序的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 文档 - Document\n\n- **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 使用 - Usage\n\n- [**在 微信小程序 中使用**](https://100px.net/usage/wx.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/react/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 在 React 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/react.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/taro/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>@lucky-canvas/taro 抽奖插件</h1>\n  <p>一个基于 Taro 的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/LuckDraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net/usage/taro.html](https://100px.net/usage/taro.html)\n\n<br />\n\n## 在 Taro 中使用\n\n### 安装\n\n> 为了确保相关依赖安装正确, 你必须通过 npm / yarn 来安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/taro@latest\n\n# yarn 安装：\nyarn add @lucky-canvas/taro@latest\n```\n\n\n<br />\n\n### 使用\n\n#### taro-vue 简单示例\n\n- [点击查看 taro-vue 完整示例](https://100px.net/usage/taro.html)\n\n```html\n<template>\n  <view>\n\n    <!-- 大转盘抽奖 -->\n    <LuckyWheel width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 九宫格抽奖 -->\n    <LuckyGrid width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 老虎机抽奖 -->\n    <SlotMachine width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n  </view>\n</template>\n\n<script>\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/vue'\nexport default {\n  components: { LuckyWheel, LuckyGrid, SlotMachine },\n}\n</script>\n```\n\n<br />\n\n#### taro-react 简单示例\n\n- [点击查看 taro-react 完整示例](https://100px.net/usage/taro.html)\n\n```js\nimport React from 'react'\nimport { View } from '@tarojs/components'\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/react'\n\nexport default class Index extends React.Component {\n  render () {\n    return <View>\n\n      {/* 大转盘抽奖 */}\n      <LuckyWheel width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 大转盘抽奖 */}\n      <LuckyGrid width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 老虎机抽奖 */}\n      <SlotMachine width=\"300px\" height=\"300px\" ...你的配置 />\n\n    </View>\n  }\n}\n```\n\n<br />\n\n## 完整文档: https://100px.net\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜) ☜(ﾟヮﾟ☜)**\n\n<br />\n","packages/uni/README.md":"<br />\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n\n|适配框架|npm下载量|CDN使用量|\n| :-: | :-: | :-: |\n|[`JS` / `JQ` 中使用](https://100px.net/usage/js.html)|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|[`Vue` 中使用](https://100px.net/usage/vue.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|[`React` 中使用](https://100px.net/usage/react.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`UniApp` 中使用](https://100px.net/usage/uni.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`Taro3.x` 中使用](https://100px.net/usage/taro.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`微信小程序` 中使用](https://100px.net/usage/wx.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net](https://100px.net)\n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n  \n<br />\n\n## 在 uni-app 中使用\n\n### 1. 安装插件\n\n- 你可以选择通过 `HBuilderX` 导入插件： [https://ext.dcloud.net.cn/plugin?id=3499](https://ext.dcloud.net.cn/plugin?id=3499)\n\n- 也可以选择通过 `npm` / `yarn` 安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/uni\n\n# yarn 安装：\nyarn add @lucky-canvas/uni\n```\n\n<br />\n\n### 2. 引入并使用\n\n```html\n<view>\n  <!-- 大转盘抽奖 -->\n  <LuckyWheel\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n  <!-- 九宫格抽奖 -->\n  <LuckyGrid\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n</view>\n```\n\n```js\n// npm 下载会默认到 node_modules 里面，直接引入包名即可\nimport LuckyWheel from '@lucky-canvas/uni/lucky-wheel' // 大转盘\nimport LuckyGrid from '@lucky-canvas/uni/lucky-grid' // 九宫格\n\n// 如果你是通过 HBuilderX 导入插件，那你需要指定一下路径\n// import LuckyWheel from '@/components/@lucky-canvas/uni/lucky-wheel' // 大转盘\n// import LuckyGrid from '@/components/@lucky-canvas/uni/lucky-grid' // 九宫格\n\nexport default {\n  // 注册组件\n  components: { LuckyWheel, LuckyGrid },\n}\n```\n\n<br />\n\n### 3. 我提供了一个最基本的 demo 供你用于尝试\n\n由于 uni-app 渲染 md 的时候会出问题，所以我把 demo 代码放到了文档里\n\n- [https://100px.net/usage/uni-app.html](https://100px.net/usage/uni-app.html)\n\n<br />\n\n### **4. 补充说明**\n\n- [**如果用着顺手, 可以在 Github 上面点个 <img height=\"22\" align=\"top\" src=\"https://img.shields.io/github/stars/buuing/lucky-canvas\" /> 支持一下(●'◡'●)**](https://github.com/buuing/lucky-canvas)\n\n- 另外: 如果你修复了某些bug或兼容, 欢迎提给我, 我会把你展示到官网的贡献者列表当中\n\n\n<br />\n\n### 5. 常见问题\n\n1. 转盘层级太高了, 我的弹窗盖不住怎么办?\n\n> 答: 因为小程序里canvas是原生组件顶层渲染, 我无法控制canvas的层级, 如果你想盖住它也肯简单, 你可以百度搜索`<cover>`组件\n\n2. 你这些素材, 图片组件从哪下载?\n\n> 答: 官网里的任何图片素材, 所使用到的图片资源均为学习交流使用, 请勿将其用于商业用途, 由此产生的任何商业纠纷我这边概不负责\n\n3. xxx属性怎么使用? xxx方法怎么调用?\n\n> 答: 自己去看文档, 不然难道要我把代码给你写好吗?\n\n4. 这个属性的效果与官网的描述不一致?\n\n> 答: 可能有bug, 你可以去github上的issues去提问 (请认真填写模板)\n\n5. 为什么这个插件不支持app和其他小程序\n\n> 答: 没时间, 但是希望志同道合的同学来一起参与uniapp的兼容开发\n\n---\n\n<font color=\"blue\">作者留言: 为了使我自己保持心情愉悦, 低于5星的提问我用浏览器插件都屏蔽了</font>\n\n<font color=\"green\" size=\"50\">不要通过插件市场赞赏!!!</font>\n","packages/vue/README.md":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/luckdraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<div align=\"center\">\n\n|适配框架|npm包|最新版本|npm下载量|CDN使用量|\n| :-: | :-: | :-: | :-: | :-: |\n|`JS` / `JQ`|[lucky-canvas](https://100px.net/usage/js.html)|<img src=\"https://img.shields.io/npm/v/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|`Vue2.x` / `Vue3.x`|[@lucky-canvas/vue](https://100px.net/usage/vue.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|`React`|[@lucky-canvas/react](https://100px.net/usage/react.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`UniApp`|[@lucky-canvas/uni](https://100px.net/usage/uni.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`Taro3.x`|[@lucky-canvas/taro](https://100px.net/usage/taro.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`微信小程序`|[@lucky-canvas/mini](https://100px.net/usage/wx.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n</div>\n\n<br />\n\n## 在 vue2.x / vue3.x 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/vue.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n"},"items":[{"name":"AGENTS.md","path":"AGENTS.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/AGENTS.md","title":"AI Agent Protocol & Instructions","category":"root-instruction","format":"markdown","content":"# Git 提交约定\n\n- 每次完成一个需求后，使用中文自动创建一次 Git commit，并遵循 Conventional Commits 格式。\n- 提交信息使用 `type: 中文描述` 的格式；新增功能使用 `feat:`，维护规范或构建配置使用 `chore:`，修复问题使用 `fix:`。\n\n# 代码修改前提\n\n- 每次开始改代码前，必须确保已充分理解需求和相关上下文；若上下文不足，不得直接修改代码。\n\n# 旧官网文档\n\n- 旧的官网文档位于与 `lucky-canvas` 同一层级的 `100px.net` 目录。\n","isInternal":false,"tokens":187,"sizeBytes":552},{"name":"README.md","path":"packages/core/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/core/README.md","title":"core Documentation","category":"plugin-manifest","format":"markdown","content":"\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net/usage/js.html](https://100px.net/usage/js.html)  \n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n\n\n<br />\n\n## 在 JS / TS 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/js.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n","isInternal":false,"tokens":572,"sizeBytes":1670},{"name":"README.md","path":"packages/mini/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/mini/README.md","title":"mini Documentation","category":"plugin-manifest","format":"markdown","content":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>微信小程序 抽奖组件</h1>\n  <p>一个基于微信小程序的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 文档 - Document\n\n- **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 使用 - Usage\n\n- [**在 微信小程序 中使用**](https://100px.net/usage/wx.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","isInternal":false,"tokens":530,"sizeBytes":1538},{"name":"README.md","path":"packages/react/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/react/README.md","title":"react Documentation","category":"plugin-manifest","format":"markdown","content":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 在 React 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/react.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n","isInternal":false,"tokens":532,"sizeBytes":1536},{"name":"README.md","path":"packages/taro/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/taro/README.md","title":"taro Documentation","category":"plugin-manifest","format":"markdown","content":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>@lucky-canvas/taro 抽奖插件</h1>\n  <p>一个基于 Taro 的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/LuckDraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net/usage/taro.html](https://100px.net/usage/taro.html)\n\n<br />\n\n## 在 Taro 中使用\n\n### 安装\n\n> 为了确保相关依赖安装正确, 你必须通过 npm / yarn 来安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/taro@latest\n\n# yarn 安装：\nyarn add @lucky-canvas/taro@latest\n```\n\n\n<br />\n\n### 使用\n\n#### taro-vue 简单示例\n\n- [点击查看 taro-vue 完整示例](https://100px.net/usage/taro.html)\n\n```html\n<template>\n  <view>\n\n    <!-- 大转盘抽奖 -->\n    <LuckyWheel width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 九宫格抽奖 -->\n    <LuckyGrid width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 老虎机抽奖 -->\n    <SlotMachine width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n  </view>\n</template>\n\n<script>\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/vue'\nexport default {\n  components: { LuckyWheel, LuckyGrid, SlotMachine },\n}\n</script>\n```\n\n<br />\n\n#### taro-react 简单示例\n\n- [点击查看 taro-react 完整示例](https://100px.net/usage/taro.html)\n\n```js\nimport React from 'react'\nimport { View } from '@tarojs/components'\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/react'\n\nexport default class Index extends React.Component {\n  render () {\n    return <View>\n\n      {/* 大转盘抽奖 */}\n      <LuckyWheel width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 大转盘抽奖 */}\n      <LuckyGrid width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 老虎机抽奖 */}\n      <SlotMachine width=\"300px\" height=\"300px\" ...你的配置 />\n\n    </View>\n  }\n}\n```\n\n<br />\n\n## 完整文档: https://100px.net\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜) ☜(ﾟヮﾟ☜)**\n\n<br />\n","isInternal":false,"tokens":1034,"sizeBytes":3085},{"name":"README.md","path":"packages/uni/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/uni/README.md","title":"uni Documentation","category":"plugin-manifest","format":"markdown","content":"<br />\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n\n|适配框架|npm下载量|CDN使用量|\n| :-: | :-: | :-: |\n|[`JS` / `JQ` 中使用](https://100px.net/usage/js.html)|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|[`Vue` 中使用](https://100px.net/usage/vue.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|[`React` 中使用](https://100px.net/usage/react.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`UniApp` 中使用](https://100px.net/usage/uni.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`Taro3.x` 中使用](https://100px.net/usage/taro.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`微信小程序` 中使用](https://100px.net/usage/wx.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net](https://100px.net)\n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n  \n<br />\n\n## 在 uni-app 中使用\n\n### 1. 安装插件\n\n- 你可以选择通过 `HBuilderX` 导入插件： [https://ext.dcloud.net.cn/plugin?id=3499](https://ext.dcloud.net.cn/plugin?id=3499)\n\n- 也可以选择通过 `npm` / `yarn` 安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/uni\n\n# yarn 安装：\nyarn add @lucky-canvas/uni\n```\n\n<br />\n\n### 2. 引入并使用\n\n```html\n<view>\n  <!-- 大转盘抽奖 -->\n  <LuckyWheel\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n  <!-- 九宫格抽奖 -->\n  <LuckyGrid\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n</view>\n```\n\n```js\n// npm 下载会默认到 node_modules 里面，直接引入包名即可\nimport LuckyWheel from '@lucky-canvas/uni/lucky-wheel' // 大转盘\nimport LuckyGrid from '@lucky-canvas/uni/lucky-grid' // 九宫格\n\n// 如果你是通过 HBuilderX 导入插件，那你需要指定一下路径\n// import LuckyWheel from '@/components/@lucky-canvas/uni/lucky-wheel' // 大转盘\n// import LuckyGrid from '@/components/@lucky-canvas/uni/lucky-grid' // 九宫格\n\nexport default {\n  // 注册组件\n  components: { LuckyWheel, LuckyGrid },\n}\n```\n\n<br />\n\n### 3. 我提供了一个最基本的 demo 供你用于尝试\n\n由于 uni-app 渲染 md 的时候会出问题，所以我把 demo 代码放到了文档里\n\n- [https://100px.net/usage/uni-app.html](https://100px.net/usage/uni-app.html)\n\n<br />\n\n### **4. 补充说明**\n\n- [**如果用着顺手, 可以在 Github 上面点个 <img height=\"22\" align=\"top\" src=\"https://img.shields.io/github/stars/buuing/lucky-canvas\" /> 支持一下(●'◡'●)**](https://github.com/buuing/lucky-canvas)\n\n- 另外: 如果你修复了某些bug或兼容, 欢迎提给我, 我会把你展示到官网的贡献者列表当中\n\n\n<br />\n\n### 5. 常见问题\n\n1. 转盘层级太高了, 我的弹窗盖不住怎么办?\n\n> 答: 因为小程序里canvas是原生组件顶层渲染, 我无法控制canvas的层级, 如果你想盖住它也肯简单, 你可以百度搜索`<cover>`组件\n\n2. 你这些素材, 图片组件从哪下载?\n\n> 答: 官网里的任何图片素材, 所使用到的图片资源均为学习交流使用, 请勿将其用于商业用途, 由此产生的任何商业纠纷我这边概不负责\n\n3. xxx属性怎么使用? xxx方法怎么调用?\n\n> 答: 自己去看文档, 不然难道要我把代码给你写好吗?\n\n4. 这个属性的效果与官网的描述不一致?\n\n> 答: 可能有bug, 你可以去github上的issues去提问 (请认真填写模板)\n\n5. 为什么这个插件不支持app和其他小程序\n\n> 答: 没时间, 但是希望志同道合的同学来一起参与uniapp的兼容开发\n\n---\n\n<font color=\"blue\">作者留言: 为了使我自己保持心情愉悦, 低于5星的提问我用浏览器插件都屏蔽了</font>\n\n<font color=\"green\" size=\"50\">不要通过插件市场赞赏!!!</font>\n","isInternal":false,"tokens":2164,"sizeBytes":6180},{"name":"README.md","path":"packages/vue/README.md","rawUrl":"https://raw.githubusercontent.com/buuing/lucky-canvas/HEAD/packages/vue/README.md","title":"vue Documentation","category":"plugin-manifest","format":"markdown","content":"\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/luckdraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<div align=\"center\">\n\n|适配框架|npm包|最新版本|npm下载量|CDN使用量|\n| :-: | :-: | :-: | :-: | :-: |\n|`JS` / `JQ`|[lucky-canvas](https://100px.net/usage/js.html)|<img src=\"https://img.shields.io/npm/v/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|`Vue2.x` / `Vue3.x`|[@lucky-canvas/vue](https://100px.net/usage/vue.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|`React`|[@lucky-canvas/react](https://100px.net/usage/react.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`UniApp`|[@lucky-canvas/uni](https://100px.net/usage/uni.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`Taro3.x`|[@lucky-canvas/taro](https://100px.net/usage/taro.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`微信小程序`|[@lucky-canvas/mini](https://100px.net/usage/wx.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n</div>\n\n<br />\n\n## 在 vue2.x / vue3.x 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/vue.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n","isInternal":false,"tokens":1457,"sizeBytes":4265}],"systemPromptSnippet":"<yakaai_skills repo=\"buuing/lucky-canvas\">\n<!-- File: AGENTS.md (Tokens: ~187 | Category: root-instruction) -->\n# Git 提交约定\n\n- 每次完成一个需求后，使用中文自动创建一次 Git commit，并遵循 Conventional Commits 格式。\n- 提交信息使用 `type: 中文描述` 的格式；新增功能使用 `feat:`，维护规范或构建配置使用 `chore:`，修复问题使用 `fix:`。\n\n# 代码修改前提\n\n- 每次开始改代码前，必须确保已充分理解需求和相关上下文；若上下文不足，不得直接修改代码。\n\n# 旧官网文档\n\n- 旧的官网文档位于与 `lucky-canvas` 同一层级的 `100px.net` 目录。\n\n<!-- File: packages/core/README.md (Tokens: ~572 | Category: plugin-manifest) -->\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net/usage/js.html](https://100px.net/usage/js.html)  \n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n\n\n<br />\n\n## 在 JS / TS 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/js.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<!-- File: packages/mini/README.md (Tokens: ~530 | Category: plugin-manifest) -->\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>微信小程序 抽奖组件</h1>\n  <p>一个基于微信小程序的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 文档 - Document\n\n- **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 使用 - Usage\n\n- [**在 微信小程序 中使用**](https://100px.net/usage/wx.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n\n<!-- File: packages/react/README.md (Tokens: ~532 | Category: plugin-manifest) -->\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net](https://100px.net)\n\n<br />\n\n## 在 React 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/react.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n\n<br />\n\n<!-- File: packages/taro/README.md (Tokens: ~1034 | Category: plugin-manifest) -->\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>@lucky-canvas/taro 抽奖插件</h1>\n  <p>一个基于 Taro 的 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/LuckDraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/LuckDraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<br />\n\n## 官方文档\n\n> **中文**：[https://100px.net/usage/taro.html](https://100px.net/usage/taro.html)\n\n<br />\n\n## 在 Taro 中使用\n\n### 安装\n\n> 为了确保相关依赖安装正确, 你必须通过 npm / yarn 来安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/taro@latest\n\n# yarn 安装：\nyarn add @lucky-canvas/taro@latest\n```\n\n\n<br />\n\n### 使用\n\n#### taro-vue 简单示例\n\n- [点击查看 taro-vue 完整示例](https://100px.net/usage/taro.html)\n\n```html\n<template>\n  <view>\n\n    <!-- 大转盘抽奖 -->\n    <LuckyWheel width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 九宫格抽奖 -->\n    <LuckyGrid width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n    <!-- 老虎机抽奖 -->\n    <SlotMachine width=\"600rpx\" height=\"600rpx\" ...你的配置 />\n\n  </view>\n</template>\n\n<script>\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/vue'\nexport default {\n  components: { LuckyWheel, LuckyGrid, SlotMachine },\n}\n</script>\n```\n\n<br />\n\n#### taro-react 简单示例\n\n- [点击查看 taro-react 完整示例](https://100px.net/usage/taro.html)\n\n```js\nimport React from 'react'\nimport { View } from '@tarojs/components'\nimport { LuckyWheel, LuckyGrid, SlotMachine } from '@lucky-canvas/taro/react'\n\nexport default class Index extends React.Component {\n  render () {\n    return <View>\n\n      {/* 大转盘抽奖 */}\n      <LuckyWheel width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 大转盘抽奖 */}\n      <LuckyGrid width=\"300px\" height=\"300px\" ...你的配置 />\n\n      {/* 老虎机抽奖 */}\n      <SlotMachine width=\"300px\" height=\"300px\" ...你的配置 />\n\n    </View>\n  }\n}\n```\n\n<br />\n\n## 完整文档: https://100px.net\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/buuing/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜) ☜(ﾟヮﾟ☜)**\n\n<br />\n\n<!-- File: packages/uni/README.md (Tokens: ~2164 | Category: plugin-manifest) -->\n<br />\n\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.jpg\" width=\"210\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/buuing/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/buuing/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/buuing/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/buuing/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n\n|适配框架|npm下载量|CDN使用量|\n| :-: | :-: | :-: |\n|[`JS` / `JQ` 中使用](https://100px.net/usage/js.html)|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|[`Vue` 中使用](https://100px.net/usage/vue.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|[`React` 中使用](https://100px.net/usage/react.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`UniApp` 中使用](https://100px.net/usage/uni.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`Taro3.x` 中使用](https://100px.net/usage/taro.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|[`微信小程序` 中使用](https://100px.net/usage/wx.html)|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n<br />\n\n## 官方文档 & Demo演示\n\n> **中文**：[https://100px.net](https://100px.net)\n\n> **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`\n  \n<br />\n\n## 在 uni-app 中使用\n\n### 1. 安装插件\n\n- 你可以选择通过 `HBuilderX` 导入插件： [https://ext.dcloud.net.cn/plugin?id=3499](https://ext.dcloud.net.cn/plugin?id=3499)\n\n- 也可以选择通过 `npm` / `yarn` 安装\n\n```shell\n# npm 安装：\nnpm install @lucky-canvas/uni\n\n# yarn 安装：\nyarn add @lucky-canvas/uni\n```\n\n<br />\n\n### 2. 引入并使用\n\n```html\n<view>\n  <!-- 大转盘抽奖 -->\n  <LuckyWheel\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n  <!-- 九宫格抽奖 -->\n  <LuckyGrid\n    width=\"600rpx\"\n    height=\"600rpx\"\n    ...你的配置\n  />\n</view>\n```\n\n```js\n// npm 下载会默认到 node_modules 里面，直接引入包名即可\nimport LuckyWheel from '@lucky-canvas/uni/lucky-wheel' // 大转盘\nimport LuckyGrid from '@lucky-canvas/uni/lucky-grid' // 九宫格\n\n// 如果你是通过 HBuilderX 导入插件，那你需要指定一下路径\n// import LuckyWheel from '@/components/@lucky-canvas/uni/lucky-wheel' // 大转盘\n// import LuckyGrid from '@/components/@lucky-canvas/uni/lucky-grid' // 九宫格\n\nexport default {\n  // 注册组件\n  components: { LuckyWheel, LuckyGrid },\n}\n```\n\n<br />\n\n### 3. 我提供了一个最基本的 demo 供你用于尝试\n\n由于 uni-app 渲染 md 的时候会出问题，所以我把 demo 代码放到了文档里\n\n- [https://100px.net/usage/uni-app.html](https://100px.net/usage/uni-app.html)\n\n<br />\n\n### **4. 补充说明**\n\n- [**如果用着顺手, 可以在 Github 上面点个 <img height=\"22\" align=\"top\" src=\"https://img.shields.io/github/stars/buuing/lucky-canvas\" /> 支持一下(●'◡'●)**](https://github.com/buuing/lucky-canvas)\n\n- 另外: 如果你修复了某些bug或兼容, 欢迎提给我, 我会把你展示到官网的贡献者列表当中\n\n\n<br />\n\n### 5. 常见问题\n\n1. 转盘层级太高了, 我的弹窗盖不住怎么办?\n\n> 答: 因为小程序里canvas是原生组件顶层渲染, 我无法控制canvas的层级, 如果你想盖住它也肯简单, 你可以百度搜索`<cover>`组件\n\n2. 你这些素材, 图片组件从哪下载?\n\n> 答: 官网里的任何图片素材, 所使用到的图片资源均为学习交流使用, 请勿将其用于商业用途, 由此产生的任何商业纠纷我这边概不负责\n\n3. xxx属性怎么使用? xxx方法怎么调用?\n\n> 答: 自己去看文档, 不然难道要我把代码给你写好吗?\n\n4. 这个属性的效果与官网的描述不一致?\n\n> 答: 可能有bug, 你可以去github上的issues去提问 (请认真填写模板)\n\n5. 为什么这个插件不支持app和其他小程序\n\n> 答: 没时间, 但是希望志同道合的同学来一起参与uniapp的兼容开发\n\n---\n\n<font color=\"blue\">作者留言: 为了使我自己保持心情愉悦, 低于5星的提问我用浏览器插件都屏蔽了</font>\n\n<font color=\"green\" size=\"50\">不要通过插件市场赞赏!!!</font>\n\n<!-- File: packages/vue/README.md (Tokens: ~1457 | Category: plugin-manifest) -->\n<div align=\"center\">\n  <img src=\"https://unpkg.com/buuing@0.0.1/imgs/lucky-canvas.png\" width=\"128\" alt=\"logo\" />\n  <h1>lucky-canvas 抽奖插件</h1>\n  <p>一个基于 JavaScript 的跨平台 ( 大转盘 / 九宫格 / 老虎机 ) 抽奖插件</p>\n  <p>\n    <a href=\"https://github.com/LuckDraw/lucky-canvas/stargazers\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/stars/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"stars\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/network/members\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/forks/luckdraw/lucky-canvas?color=%23ffba15&logo=github&style=flat-square\" alt=\"forks\" />\n    </a>\n    <a href=\"https://github.com/buuing\" target=\"_black\">\n      <img src=\"https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square\" alt=\"author\" />\n    </a>\n    <a href=\"https://github.com/luckdraw/lucky-canvas/blob/master/LICENSE\" target=\"_black\">\n      <img src=\"https://img.shields.io/github/license/luckdraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square\" alt=\"license\" />\n    </a>\n  </p>\n</div>\n\n<div align=\"center\">\n\n|适配框架|npm包|最新版本|npm下载量|CDN使用量|\n| :-: | :-: | :-: | :-: | :-: |\n|`JS` / `JQ`|[lucky-canvas](https://100px.net/usage/js.html)|<img src=\"https://img.shields.io/npm/v/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/lucky-canvas\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/lucky-canvas?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/lucky-canvas\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge\" alt=\"downloads\" /></a>|\n|`Vue2.x` / `Vue3.x`|[@lucky-canvas/vue](https://100px.net/usage/vue.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/vue?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|<a href=\"https://www.jsdelivr.com/package/npm/@lucky-canvas/vue\" target=\"_black\"><img src=\"https://data.jsdelivr.com/v1/package/npm/@lucky-canvas/vue/badge\" alt=\"downloads\" /></a>|\n|`React`|[@lucky-canvas/react](https://100px.net/usage/react.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/react\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/react?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`UniApp`|[@lucky-canvas/uni](https://100px.net/usage/uni.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/uni\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/uni?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`Taro3.x`|[@lucky-canvas/taro](https://100px.net/usage/taro.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/taro\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/taro?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n|`微信小程序`|[@lucky-canvas/mini](https://100px.net/usage/wx.html)|<img src=\"https://img.shields.io/npm/v/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"version\" />|<a href=\"https://www.npmjs.com/package/@lucky-canvas/mini\" target=\"_black\"><img src=\"https://img.shields.io/npm/dm/@lucky-canvas/mini?color=%23ffba15&logo=npm&style=flat-square\" alt=\"downloads\" /></a>|-|\n\n</div>\n\n<br />\n\n## 在 vue2.x / vue3.x 中使用\n\n- [跳转官网 查看详情](https://100px.net/usage/vue.html)\n\n<br />\n\n## 🙏🙏🙏 点个Star\n\n**如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/lucky-canvas) 上面帮我点个`star`, 支持一下作者 ☜(ﾟヮﾟ☜)**\n</yakaai_skills>"}