盐城网站建设价位,武昌手机网站,端口扫描站长工具,手机网站如何做外链下面#xff0c;粗略的介绍一下微信小程序的条件渲染、列表渲染、数据绑定等#xff0c;详细的内容大家可以去看微信小程序的API,在此只做简单描述#xff0c;希望能帮助到大家 条件渲染 !--wxml--
view wx:if{{view WEBVIEW}} WEBVIEW /v…下面粗略的介绍一下微信小程序的条件渲染、列表渲染、数据绑定等详细的内容大家可以去看微信小程序的API,在此只做简单描述希望能帮助到大家 条件渲染 !--wxml--
view wx:if{{view WEBVIEW}} WEBVIEW /view
view wx:elif{{view APP}} APP /view
view wx:else{{view MINA}} MINA /view// page.js
Page({data: {view: MINA}
}) block wx:if block和template差不多在控制台不可见标签 因为 wx:if 是一个控制属性需要将它添加到一个标签上。如果要一次性判断多个组件标签可以使用一个 block/ 标签将多个组件包装起来并在上边使用 wx:if 控制属性。 block wx:if{{true}}view view1 /view view view2 /view /block 注意 block/ 并不是一个组件它仅仅是一个包装元素不会在页面中做任何渲染只接受控制属性。 列表渲染 !--wxml--1.view wx:for{{[zero, 1, 2, 3, 4]}} {{item}} /view//自定义数组循环view wx:for{{array}} {{item}} /view// page.js
Page({data: {zero6array: [1, 2, 3, 4, 5]}
}) 2.此处的wx:for-itemnewItem可以不用相当于把item赋给newItem 不写时下面的newItem.title换成item.title。此处的wx:for-indexid其实就是每一个item的索引 view wx:for{{newList}} wx:for-itemnewItem wx:for-indexid wx:key{{id}} view{{id1}}.{{newItem.title}}/view view{{newItem.content}}/view /view 数据绑定 !--wxml--
view {{message}} /view// page.js
Page({data: {message: Hello MINA!}
}) 对象解构 模板 此处的template是虚拟的标签在控制台的标签元素是看不到的所以向该标签 内写内容是无法显示的只能通过如下方法用is调用 1.1!--wxml--template namestaffNameviewFirstName: {{firstName}}, LastName: {{lastName}}/view/template//表示控制以上namestaffName下的view的视图其中data调用对象时用三个点表示template isstaffName data{{...staffA}}/template
template isstaffName data{{...staffB}}/template
template isstaffName data{{...staffC}}/template// page.js
Page({data: {staffA: {firstName: Hulk, lastName: Hu},staffB: {firstName: Shang, lastName: You},staffC: {firstName: Gideon, lastName: Lin}}
}) 1.2//is 属性可以使用 Mustache 语法来动态决定具体需要渲染哪个模板 template nameoddview odd /view
/template
template nameevenview even /view
/templateblock wx:for{{[1, 2, 3, 4, 5]}}template is{{item % 2 0 ? even : odd}}/
/block 2. templateisobjectCombinedata{{for: a, bar: b}}/template Page({data: {a: 1,b: 2 } }) 最终组合成的对象是 {for: 1, bar: 2} 3. 如果对象的 key 和 value 相同也可以间接地表达。 template isobjectCombine data{{foo, bar}}/template Page({data: {foo: my-foo,bar: my-bar } }) 最终组合成的对象是 {foo: my-foo, bar:my-bar} 转载于:https://www.cnblogs.com/Dark-fire-liehuo/p/9593406.html
