视频教程记录

事件分类以及阻止事件冒泡

没有 click

bind:tap 简写 bindtap

<view class="box1" bind:tap="handleClikBox1">
  // 阻止事件冒泡使用 catch
  <view class="box2" catch:tap="handleClikBox2">博学</view>
</view>

事件系统，事件传参

data 传参

<view data-name="age" data-age="999">
  <button bind:tap="handleClikData" data-name="tom" data-age="888">点击</button>
</view>

handleClikData(even){
  console.log("even",even.currentTarget.dataset)
  console.log("even",even.target.dataset)
}

• 在传递参数的时候，如果自定义属性是多个单词，单词与单词直接使用中划线-进行连接

• 在事件对象中会被转换为小托峰写法

• 在传递参数的时候，如果自定义属性是多个单词，单词如果使用的是小托峰写法
• 在事件对象中会被转为全部小写的

make 传参

<view mark:name="age" mage:age="999">
  <button bind:tap="handleClikData" mark:name="tom" mark:age="888">点击</button>
</view>

handleClikData(even){
    console.log("even",even.mark)
}

• 可以获取父节点的 mark 有点类似冒泡的感觉，这是和上面 data 的区别

声明和绑定数据

双大括号 {{}}

支持

• 算数运算
• 三元运算
• 逻辑判断

不支持

• 只能写表达式，不能写语句，不能调用js相关方法

属性绑定值

也需要使用双大括号 {{}}

<view class="{{message}}">绑定属性值</view>