1.0.0 • Published 2 years ago

miniprogram-grid-luckdraw v1.0.0

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

miniprogram-grid-luckdraw

小程序九宫格抽奖动画组件

  • 支持布局调整
  • 带有完整实例代码
  • 调用简单, 与业务解耦(只有一个方法)

使用

  1. 安装
npm install --save miniprogram-grid-luckdraw
  1. 在需要使用 luckdraw 的页面 page.json 中添加 luckdraw 自定义组件配置
{
  "usingComponents": {
    "GridLuckdraw": "miniprogram-grid-luckdraw"
  }
}
  1. 在wxml文件 挂载 luckdraw 组件,并声明id
<GridLuckdraw id="GridLuckdrawRef" />
  1. 在js文件中调用
const id = 1
this.selectComponent('#GridLuckdrawRef').setup({ id })

参数说明

参数类型是否必填默认值说明
listarray[]奖品列表
uniqueKeystring'id'唯一key
imageSrcKeystring'src'奖品图片字段名
gridItemGapnumber10奖品布局间隙
gridItemWidthnumber140奖品宽度
gridItemHeightnumber130奖品高度
animatedbooleanfalse加载动画 (暂不支持)
speednumber100运行速度(speed 秒/次)
minRunCountnumber30最小运行次数
diminishingCountnumber25开始减速的时机 (当运行多少次后开始减速)
decelerationstring60每次运行增大间隔时间 (秒/次)
activeStylestring'background-color: rgba(255, 249, 70, 0.7);border-radius: 20rpx;'抽奖动画选中样式