weex逻辑控制

在WEEX中，有if 和 repeat 两种逻辑运算，需要注意的是，逻辑控制不能够作用于<template>这样的根节点。

 

if 控制判断条件true/false直接对节点进行操作，if="true"，添加一个节点， if="false"，移除一个节点 ,使用if 的时候可以不用用花括号括起来。

 

repeat 就是对数组进行渲染，我们对数组进行repeat，在它的子元素上，绑定数组中的一个对象的key，就可以获取到相应的value了。

<template>
  <container>
    <container repeat="{{list}}" class="{{gender}}"> <image src="{{avatar}}"></image> <text>{{nickname}}</text> </container> </container> </template> <style> .male {...} .female {...} </style> <script> module.exports = { data: { list: [ {gender: 'male', nickname: 'Li Lei', avatar: '...'}, {gender: 'female', nickname: 'Han Meimei', avatar: '...'}, ... ] } } </script>


循环的过程中，不是 数组中循环的对象也是可以被嵌套调用的。

用$index可以获取到当前是在数组中的第一个。


正常情况下，track-by会导致整个循环列表被重新渲染。使用track-by可以尽可能地复用已经存在的，在使用track-by语法时，不要使用数据绑定语法。

转载于:https://www.cnblogs.com/xiangming25/p/5862636.html