pt-grid

miniapp component for taobao

安装

# npm 
npm install pt-grid
 
# yarn 
yarn add pt-grid

示例

代码片段

example.axml

<pintu
  ref="pintuRef"
  backgroundImage="{{backgroundImage}}"
  width="{{width}}"
  height="{{height}}"
  level="{{level}}"
  onGameOver="onGameOver"
/>

example.js

Page({
  data: {
    level:3,
    backgroundImage:"http://p4.music.126.net/qX3ID48PhpAiDIt-VqlNkw==/109951163524169951.jpg",
    width:300,
    height:300
  },
  pintuRef(ref) {
 // 存储自定义组件实例，方便以后调用
    this.pintu = ref;
  },
  onGameOver() {
    let _self =this;
    my.confirm({
      title: '温馨提示',
      content: '游戏结束',
      confirmButtonText: '再来一次',
      cancelButtonText: '太简单了',
      success: (result) => {
        result.confirm && _self.pintu.initGame(_self.data.level);
      },
    });
  }
 
});
 

example.json

{
  "usingComponents": {
    "pintu": "pt-grid/es/index"
  }
}

属性

名称	类型	描述	默认值
level	number	难度（网格数）	3
width	宽度	宽度	300
height	string|number	高度	300
backgroundImage	string	背景图片（最好宽高相等）	“”
onGameOver	function	游戏结束回调	()=>void