v-for介绍

            v-for语法
我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用 item in items 形式的特殊语法，items 是源数据数组并且 item 是数组元素迭代的别名。
v-for
作用： 列表渲染，所在标签结构，按照数据数量，循环生成。指令写在谁身上，就循环创建谁

语法：

v-for = "(值变量，索引变量) in 目标结构" ：key = 索引变量

v-for = "值变量 in 目标结构 ：key = 索引变量"

目标结构：可以是数组，对象，字符串

数组方法如果修改了原数据就会更新 页面，如果没有修改，则不会，但可以重新赋值给变量让你页面更新

v-for中的key作用：在更新的时候：

有key，按照key比较，key设置为index：等于没设，就地复用
无key，就地更新
v-for中key

唯一不重复的字符串或者数值，数组中的id

key在使用过程中，有id用id，无id用索引

key的好处

可以提高更新的性能

两种使用v-for的情况：

 <div id="app">
        <button @click="add">添加</button>
         <ul>
            <li v-for="(item,index) in list">{{index}} -{{item}}</li>
         </ul>
    </div>
    <script>
          new Vue({
            el:'#app',
            data:{
                list:['邹运爱吃烤猪','结果反手一个','碰到了天蓬元帅','被反吃一波']
            },
            methods:{
                add(){
                    this.list.push('邹运是大屌毛')  
                }
            }
          })
        //   运行结果
        //     0 -邹运爱吃烤猪
        //     1 -结果反手一个
        //     2 -碰到了天蓬元帅
        //     3 -被反吃一波
        //     4 -邹运是大屌毛，此为添加项
    </script>