vue获取data中数组的value值_控制台修改vue组件中data对象里的数组意外失效

摘要：

最近在学习Vue.js，其语法很像angularjs。然后在学习过程中遇到一些奇怪的事情，比如这篇提到的：修改data对象里面的数组，有的成功有的意外失效......

一、发现

最近在看Vue.js，然后发现data对象里面的属性并非都可以通过控制台来更新！

按照官方的说法：每个 Vue实例都会代理其 data对象里所有的属性，注意只有这些被代理的属性是响应的......配图一张：

然后艺灵就按照此示例练习了下，最终的结果有点出人意料之外。话不多说，上代码。

二、示例代码

2.1、js源码

var app=new Vue({

el:'#app',

data:{

a:1,

b:'',

items:[

{text:'i0'},

{text:'i1'},

{text:'i2'}

],

todos:{

text1:'t1',

text2:'t2',

text3:'t3'

},

arrs:[

'Do the dishes',

'Take out the trash',

'Mow the lawn'

]

}

});

为了更直观的看到效果，有必要在页面中显示下data