微信小程序继续入坑指南

Page({
  data: {
    message: "hello world"
  }
})

<view>{{message}}</view>

<view id="item-{{id}}"></view>

Page({
  data: {
    message: "hello world",
    id: 3
  }
})

<checkbox checked="{{false}}"></checkbox>

<view hidden="{{flag?true:false}}"></view>

<view>{{a+b}}+ {{c}}</view>

<view>{{a>2}}+ {{c}}</view>

<view>{{"hello" + message}}</view>

<view>{{object.key}}</view>

<view>{{[zero, 1, 2, 3]}}</view>

<template name="msgItem">
  <view>
    <text> {{index}}: {{msg}} </text>
    <text> Time: {{time}} </text>
  </view>
</template>
<template is="msgItem" data="{{index: item.index,msg: item.index, time: item.time}}"></template>

Page({
  data: {
    item: {
      index: 0,
      msg: "222",
      time: "333"
    }
  }
})

<template name="msgItem">
  <view>
    <text> {{index}}: {{msg}} </text>
    <text> Time: {{time}} </text>
  </view>
</template>
<template is="msgItem" data="{{...item}}"></template>

<view wx:for="{{array}}">
  {{index}}:{{item.msg}}
</view>

Page({
  data: {
    array: [{
      msg: 'foo',
    }, {
      msg: 'bar'
    }]
  }
})

<view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="i">
  <view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="j">
    <view wx:if="{{i <= j}}">
      {{i}} * {{j}} = {{i * j}}
    </view>
  </view>
</view>

<block wx:for="{{[1,2,3,4]}}">
  <view>{{index}}</view>
  <view>{{item}}</view>
</block>

Page({
  data: {
    objectSwitch: [
      {
        id: 0,
        unique: "unique_0"
      }, {
        id:1,
        unique: "unique_1"
      }, {
        id:2,
        unique: "unique_2"
      }
    ]
  },
  addSwitch: function (e) {
    // 获取当前的最大的按钮数
    const length = this.data.objectSwitch.length;
    // 添加一个新数组的项，将其推入数组中
    this.data.objectSwitch = [{ id: length, unique: "unique_" + length }].concat(this.data.objectSwitch);
    // 重新进行页面的渲染
    this.setData({
      objectSwitch: this.data.objectSwitch
    })
  }
})

<switch wx:for="{{objectSwitch}}" wx:key="unique">{{item.id}}, {{index}}</switch>
<button bindtap="addSwitch">添加一个选项</button>

<view id="outer" bindtap="handleTap1">
  <view id="middle" catchtap="handleTap2">
    <view id="inner" bindtap="handleTap3"></view>
  </view>
</view>

capture-bind

capture-catch

<view id="outer" bind:touchstart="handleTap1" capture-bind:touchstart="handleTap2">
  <view id="inner" bind:touchstart="handleTap3" capture-bind:touchstart="handleTap4">
  </view>
</view>

Page({
  bindViewTap: (event) => {
    var data = event.currentTarget.dataset.alphaBeta;
    var data2 = event.currentTarget.dataset.alphabeta;
    console.log(data);
    console.log(data2);
  }
})

<view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap">点击一下</view>

Page({
  touch: (baseEvent) => {
    console.log(baseEvent);
  }
})

<button bindtap="touch">点击按钮触发事件</button>

<!-- item.wxml -->
<template name="item">
  <text>{{text}}</text>
</template>

<!-- 另外一个文件 -->
<import src="item.wxml"/>
<template is="item" data="{{text:"hello world"}}">

<include src="header.wxml"/>
<view>body</view>
<view src="footer.wxml"></view>

var foo = "hello world";
var bar =  function (d) { 
  return d;
}

module.exports = {
  foo: foo,
  bar: bar
}

<wxs src="./hello.wxs" module="tools"/>
<view>{{tools.msg}}</view>
<view>{{tools.bar(tools.foo)}}</view> 

var foo = "hello world"
var bar = function(d) {
  return d;
}

module.exports = {
  foo: foo,
  bar: bar
};

module.exports.msg = "some msg"

getDate()

getRegExp

console.log

element