微信小程序> 微信小程序条件判断学习示例-小程序制作

微信小程序条件判断学习示例-小程序制作

浏览量:2760 时间: 来源:卡和我
微信小程序条件判断学习示例-小程序制作

微信小程序条件判断学习示例

方法/步骤

1.打开小程序开发工具,在项目中新建mypage文件夹,在文件夹下新建page名为mypage,并将次page在app.json中设成第一页面

2.在mypage.wxml文件,添加代码如下:<view><text wx:if='{{true}}'>true时可见</text></view>编译运行程序,因为wx:if='{{true}}'所以能看到内容

3.在mypage.wxml文件,修改代码如下:<view><text wx:if='{{false}}'>true时可见</text></view>编译运行程序,因为wx:if='{{false}}'所以不能看到内容

4.通过数据绑定形式,设置可见性,增加一个button按钮用来切换显示,mypage.wxml代码如下:<view><text wx:if='{{show}}'>true时可见</text>

5.<text wx:else>false时可见</text>

6.</view>

7.<button bindtap='clickHandler'>点我切换</button>

8.在mypage.js文件绑定数据,代码如下:

9.data: {

10.show:true,

11.},

12.在mypage.js文件绑定按钮点击事件,更改data中show的值,代码如下:

13.clickHandler:function(){

14.var isShow = this.data.show;

15.this.setData({show:!isShow})

16.}

17.也可以简写:

18.this.setData({show:!this.data.show})

19.但是不能用this.show直接获取值,这也和vue不同

20.编译运行代码,点击按钮就可以切换显示了

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎