数组操作

首先我们写出来一个列表

<div id="app">
    <div v-for="(item,index) in list">
        {{item.text}}----{{index}}
    </div>
</div>

<script type="text/javascript">
        var vm = new Vue({
            el:"#app",
            data:{
                list:[{
                    id:"001",
                    text:"hello"
	            ,{
	            id:"002",
                    text:"world"
	            }]  
            }
        })
</script>

我们想修改这个数组内数据，并同时渲染到页面上

splice方法

(位置，删除个数，要添加的元素)

直接改变引用

在控制台直接修改数组

对象的操作

<div id="app">
		<div v-for= "item of userinfo">
			{{item}}
		</div>
	</div>

	<script type="text/javascript">
		var vm = new Vue({
			el:"#app",
			data:{
				userinfo:{
					name:"dell",
					age:28,
					gender:"male"
				}
			}
		})
	</script>

我们还可以循环key值

<div id="app">
    <div v-for= "(item,key) of userinfo">
        {{item}}---{{key}}
    </div>
</div>

输出结果为

对象的更新

直接在控制台修改即可

对象的增加

直接修改引用