<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<p id="app">
<p @click="add">{{a}}</p>
</p>
<script>
new Vue({
el: '#app',
data: {
a:[]
},
methods:{
add:function(){
console.log(this.a);
this.a.push(1);
console.log(this.a);
}
}
})
</script>
</body>
</html>"
![图片描述][1]
这是debug控制的特性，console.log输出的不是object的一个snapshot。你可以在控制台试一试
我的理解，因为这个a是数组；跟对象一样，都是访问内存地址查看。
因为工作中，经常用chrome
console.log一个对象，在调试器点开，里面内容基本一样，但表面可以看出前后结果是不一样的；但是，打断点，debug就会发现改变之前，和之后是不一样的。
上图
并没有一样啊，我就是把你的代码直接复制，运行了都没有一样啊~
添加后的a明明多1了呢
这里给出一种轻松愉快的解决方案：
console.log(JSON.stringify(data, null, 2))即可。