条件渲染

v-if

• 在字符串模板中，比如 Handlebars，我们得像这样写一个条件块：

          {
       {#if ok}}    
  Yes
    {
       {/if}}

• 在 Vue 中，我们使用 v-if 指令实现同样的功能：

  Yes

• 也可以用 v-else 添加一个“else 块”：

  Yes
    
  No

v-else

• 使用v-else指令来表示v-if的else块：

        
             Now you see me  
        
    
        
             Now you don't  
        

• v-else元素必须紧跟在带v-if或者v-else-if的元素的后面，否则它将不会被识别

v-else-if （2.1.0新增）

• v-else-if，顾名思义，充当v-if的“else-if块”，可以连续使用

        
             A  
        
    
        
             B  
        
    
        
             C  
        
    
        
             Not A/B/C  
        

• 类似于v-else，v-else-if也必须紧跟在带v-if或者v-else-if的元素之后

用key管理可复用的元素

v-show指令

• v-show不支持<template>元素，也不支持v-else

列表渲染

用v-for把一个数组对应为一组元素

• 我们用v-for指令根据一组数据的选项列表进行渲染。v-for指令需要使用item in items形式的特殊语法，items是源数据数组并且item是数组元素迭代的别名

数组更新检测

变异方法

• push()
• pop()
• shift()
• unshift()
• splice()
• sort()
• reverse()

替换数组

• filter()
• concat()
• slice()
• 这些不会改变原始数组，但总是返回一个新数组

对象更改检测注意事项

• 由于JavaScript的限制，vue不能检测对象属性的添加和删除
• 使用Vue.set(object,key,value)方法向嵌套对象添加响应式属性
• 需要为已有对象赋值多个新属性Object.assign()或_.extend()