微信小程序之动态改变内容①文字改变②显示隐藏

动态改变内容①文字改变②显示隐藏
①文字改变
先进行数据的简单绑定
数据绑定使用 Mustache 语法(双大括号)将变量包起来

<button bindtap='btnClick' > {{btnText}}</button>

在本页面对应js中

Page({
  data: {
btnText:"按钮内容" 
 }
}),

btnClick:function(){
  this.setData({ btnText: '这里是新内容'})
}

②显示隐藏
条件渲染
wx:if
在框架中,使用 wx:if=”{{condition}}” 来判断是否需要渲染该代码块(代码内容是否显示)
wx:else 一看就懂

<button bindtap='btnClick' >显示隐藏</button>
<view wx:if="{{testtrue}}">123</view>
<view wx:else>2333333333</view>

在本页面js中

Page({
  data: {
testtrue:true 
 }
}),
btnClick:function(){
  var isShow = this.data.testtrue;

  this.setData({testtrue:!isShow})
},
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值