条件渲染条件渲染顾名思义就是在一定条件下才会渲染页面<view wx:if="{{flag}}">
这是一个条件渲染
</view>
<view wx:if="{{score > 90}}">
成绩优秀
</view>
<view wx:elif="{{score > 70}}">
成绩良好
</view>
<view wx:elif="{{score > 60}}">
成绩及格
</view>
<view wx:else>
成绩不及格
</view>
<block wx:if="{{flag}}">
<view>1</view>
<view>2</view>
</block>
data: {
flag:false,
score:91
}
hidden渲染hidden渲染和条件渲染很相似，都是在一定条件下才会将我们需要显示的数据显示，不过两者还是有区别的，if渲染只会将符合条件的代码块渲染出来，但是hidden渲染会将所有的代码块都渲染在页面上，不过只会显示符合条件的。所以如果条件发生改变if渲染需要重新加载，但是hidden渲染不需要，但是hidden渲染初始化的消耗要高于if渲染。下图中哪怕是隐藏的代码块也是会渲染在页面上的。列表渲染通过wx:for指定我们需要循环的数组，然后我们就可以使用它默认提供的两个属性，index和item，index代表当前的索引，item表示当前的元素<view>列表渲染</view>
<view wx:for="{{array}}">
{{index}}:{{item}}
</view>
我们可以发现这个循环渲染是包括wx:for这个属性这一层的标签当然我们也可以指定索引和元素的变量名，下面的代码一样可以实现和上面一样的效果<view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itm">
{{idx}}:{{itm}}
</view>
同样我们还可以嵌套循环，这个时候就必须指定它的元素名，比如下面这种<view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="i">
<view wx:for="{{[1,2,3,4,5,6,7,8,9]}}" wx:for-item="j">
<view wx:if="{{i <= j}}">
{{i}} * {{j}} = {{i*j}}
</view>
</view>
</view>
同样还是可以通过block实现块级的循环<block wx:for="{{[1,2,3]}}">
<view>{{item}}</view>
</block>
小程序模板模板的定义<!-- 定义模板 -->
<template name="nameList">
<view class="border">
<view>name:{{name}}</view>
<view>age:{{age}}</view>
</view>
</template>
模板的使用下面的...代表解析传递<!-- 调用模板 -->
<template is="nameList" data="{{...item}}"/>
data: {
item:{
name:"zdd",
age:22
}
}
模板的作用域只是单个页面模板的引用我们可以创建一个专门的文件夹存储我们的模板文件，比如下面就创建了一个template文件夹接着我们创建一个wxml文件，并在文件中定义好我们的模板接着我们就可以在不同的页面使用这个模板了，不过需要想引入这个模板，可以通过import标签的src属性导入我们创建的模板文件<!-- 引入模板 -->
<import src="/template/itemTemplate.wxml"/>
<!-- 调用模板 -->
<template is="nameList" data="{{...item}}"/>
这样就可以使用模板了不过import没有继承性，如果a引用了b，b引用了c，那么a可以用b的代码，b也可以用c的代码，但是a不能用c的代码，它们相当于建立了连接。include标签则是直接间将目标文件的代码拷贝了过来。}

1. if分支结构 2. 循环结构 3. v-for和v-if的结合使用 4. 一点说明 5. template标签 6. 案例 }

v-if指令用于条件性地渲染一块内容。只有返回true会被渲染。*若条件为false不被渲染

用户类型：vip

v-else表示v-if的“else块”*v-else元素必须跟在v-if或者v-else-if元素的后面，v-if和v-else中间不能有其他的元素，不能被识别v-else-ifv-if的“else-if”块，可连续使用。 v-show可用于条件展示元素

hellowrold

v-show的元素始终会被渲染并保留在DOM中。*v-if：不显示时将内容不渲染，如果内容已经显示，将其内容改为不显示，将内容直接去除DOM。v-show：不显示时，就会改为display：none，但是会渲染在dom中。适合反复切换内容用。v-for循环普通数组v-for指令需要使用item in list形式的语法，其中list是原数据数组，item是被迭代的数组元素的别名