⼩程序：转盘组件的代码分析
⼩程序：转盘组件的代码分析
转盘组件的使⽤场景
营销活动中转盘抽奖等让⽤户随机选择时有⼀个良好的客户体验 。
请⾥搜索⼩程序 “亚哥唱吧”，体验转盘在⼩程序⾥的使⽤。
样例代码下载
代码⾛读
在\pages\index\index.wxml⾥的<zhuanpan…开始的代码就会⾃动加载components\zhuanpan下定义的转盘组件：代码转换
转盘原理的核⼼代码
转盘最核⼼代码：就是通过animationData数据来显⽰转动，如下代码所⽰：
集成时的注意要点
要点⼀：在要引⽤组件的页⾯的 json ⽂件(⽐如该例⼦中的\pages\index\index.json)中，写上：
"usingComponents": {
"zhuanpan": "/components/zhuanpan/zhuanpan"
}
}
##要点⼆：转盘数据源是{{xiaojuedingArr}}，可以源于某JS⽂件（此例源于：var xiaojuedingArr = require(’…/
…/utils/xiaojueding.js’)）
<!-- myAwards就是当被⼦组件触发时的函数 size：转盘⼤⼩-->
<zhuanpan id='zhuanpan'
bind:myData='getData'
bind:myAwards="getAwards"
bind:startZhuan="startZhuan"
size='{{size}}'
musicflg='{{musicflg}}'
fastJuedin='{{fastJuedin}}'
repeat='{{repeat}}'
zhuanpanArr='{{xiaojuedingArr}}'
awardsConfig='{{awardsConfig}}'>
</zhuanpan>
⼀般为了⽅便⼩程序审核发布后，修改转盘数据源，xiaojuedingArr ⾥的数据来源于云数据库⾥定义的JSon格式的数据源。下⼀个博客再讲解。多谢关注。