ant-mini-hit-eggs

1.0.2 • Public • Published

ant-mini-hit-eggs

砸金蛋支付宝小程序组件

Installation

ayarn add ant-mini-hit-eggs

Usage

  • json
{
  "usingComponents": {
    "hit-geggs": "ant-mini-hit-eggs/es/hit-geggs/index"
  }
}
  • js
Page({
  data: {
    disabled: false,
    times: 0
  },
  onStart(index) {
    console.log('开始砸金蛋', index);
    this.setData({
      times: ++this.data.times,
    })
  },
  onFinish(index) {
    console.log('砸金蛋结束', index);
    if (this.data.times >= 3) {
      this.setData({
        disabled: true,
      });
    }
  }
});
  • xaml
<view>
  <hit-geggs
    onStart="onStart"
    onFinish="onFinish"
    disabled="{{disabled}}"
  />
</view>
 

Config Options

属性 类型 默认值 含义
eggsCount Number 9 金蛋个数
eggCol Number 3 金蛋列数
eggWidth Number 200 金蛋大小,单位 rpx
hammerWidth Number 100 锤子大小, 单位 rpx
eggMarginTop Number 20 金蛋上边距
hammerOriginX Number -20 锤子原点距离组件右上顶点的偏移 X,左正右负,单位 rpx
hammerOriginY Number -20 锤子原点距离组件右上顶点的偏移 Y,下正上负,单位 rpx
jumpingInterval Number 600 金蛋跳动时间间隔,单位 ms
smashingDuration Number 1500 砸金蛋持续时间,单位 ms
className String '' 自定义类名
disabled Boolean false 是否进行游戏
onStart Function (index) => {} 砸金蛋开始的回调,参数:index 被砸金蛋的下标
onFinish Function (index) => {} 砸金蛋结束的回调,参数:index 被砸金蛋的下标
hammerIcon String src 锤子图标
eggIcon String src 金蛋图标
jumpIcon String src 金蛋跳动的图标
redBagIcon String src 金蛋被砸的图标
smashedIcon String src 金蛋砸碎的图标

API

  • 开始游戏 disabled=true
  • 暂停游戏 disabled=false
  • 开始砸金蛋 onStart
  • 结束砸金蛋 onFinish

Preview

License

The MIT License (MIT).

Package Sidebar

Install

npm i ant-mini-hit-eggs

Weekly Downloads

1

Version

1.0.2

License

ISC

Unpacked Size

10.7 kB

Total Files

6

Last publish

Collaborators

  • misaka
  • 0326
  • crazymousethief