第三天——模板与配置

一、数据绑定

1.动态绑定内容

js代码（在Page的data里写）

data: {
    info: 'hello'
  }

wxml代码

<text>{{info}}</text>

2.动态绑定属性

js代码

imgSrc: 'https://upload-bbs.miyoushe.com/upload/2023/11/23/231175731/cb4cadac63551e66a0ce4d7659e3373c_4608737439679851005.png'

wxml代码

<image src="{{imgSrc}}" mode='widthFix'></image>

3.三元运算

js代码

randomNum: Math.random()*10

wxml代码

<view>{{randomNum >=5 ? '大于5': '小于5'}}</view>

二、事件绑定

事件是渲染层到逻辑层的通讯方式

常用的事件

事件回调触发的时候会收到一个事件对象event，它的详细属性如下表(event.xxx)

对于view来说，e.target指向的是触发事件的源头组件，

e.currentTarget指向的是当前正在触发事件的那个组件，因此，e.currentTarget是当前的view组件

bindtap的语法格式：小程序中没有onClick

在Page里，data下面而不是里面

btnTapHandler(e){
    console.log(e)
  }

<button type="primary" bindtap="btnTapHandler">按钮</button>

——————————-————————

说明：这是一篇很早之前的库存，发现存草稿但没发，如今小程序上线需要审核，较为麻烦，故接下来微信小程序系列停更。