微信小程序中数据绑定怎么实现
这篇文章主要介绍了微信小程序中数据绑定怎么实现,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。
北塔ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为创新互联的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:028-86922220(备注:SSL证书合作)期待与您的合作!
1、微信小程序无法从js页面中绑定wxml页面中的标签,以此来获得或者设置标签的值或者属性,全部都是用数据绑定的方式来实现
2、WXML 中的动态数据均来自对应 Page 的 data。
数据绑定:
1、简单的数据绑定
wxml中应用双大括号将data中的数据绑定到相应的标签中:{{ message }} js中: Page({ data: { message: 'Hello MINA!' } })
2、标签属性的绑定
wxml中,其中绑定的要在双引号之中:js中: Page({ data: { id: 0 } })
3、控制属性的绑定
wxml中(绑定在双引号中)//作为条件句出现,可以动态决定某一个标签出现不出现 js中: Page({ data: { condition: true } }) ---或--- wxml中(绑定在双引号中) //作为条件句出现,可以动态决定某一个标签出现不出现 js中: Page({ data: { condition: true } }) //hidden与wx:if的区别: hidden只是隐藏,但是节点是生成的 wx:if不生成节点
4、关键字(需要在双引号之内)
true:boolean 类型的 true,代表真值。 false: boolean 类型的 false,代表假值。特别注意:不要直接写 checked="false",其计算结果是一个字符串,转成 boolean 类型后代表真值。 //在新版的微信小程序开发工具中,这个问题好像被解决了,即checked="true"也是对的
5、运算
1>三元运算Hidden 2>算数运算{{a + b}} + {{c}} + d Page({ data: { a: 1, b: 2, c: 3 } }) view中的内容为 3 + 3 + d。 3>逻辑判断5}}"> 4>字符串运算{{"hello" + name}} Page({ data:{ name: 'MINA' } }) 5>数据路径运算{{object.key}} {{array[0]}} Page({ data: { object: { key: 'Hello ' }, array: ['MINA'] } }) //综上: 所有运算都是在{{}}之中进行的,这时候里面就相当于一些语言代码,而不是要呈现的内容
6、组合(不是很常见,不再赘述,如有需要,参考微信小程序开发文档,数据绑定部分)
感谢你能够认真阅读完这篇文章,希望小编分享的“微信小程序中数据绑定怎么实现”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!
标题名称:微信小程序中数据绑定怎么实现
分享地址:http://azwzsj.com/article/ipgisj.html