我将通过API调用修改Vue
实例中的很多变量。他们的初始价值并不重要。
我希望在实例化vm时有一种方法不来定义它们但是这不起作用:
vm = new Vue({
el: "#app",
data: {}
});
vm.number = 3

<div id="app">
{{ number }}
</div>
&#13;
如果我将data: {}
替换为data: { number: null }
,则代码运行正常。
我想避免的是一连串这样的声明 - 有没有办法在实例化时声明data
变量?
答案 0 :(得分:1)
不是。
docs解释了反应在Vue中的工作原理如下:
将纯JavaScript对象作为数据传递给Vue实例时 选项,Vue将遍历其所有属性并进行转换 使用Object.defineProperty获取getter / setter。
...
getter / setter对于用户是不可见的,但是在引擎盖下它们 启用Vue以执行依赖关系跟踪和更改通知 访问或修改属性。
...
由于现代JavaScript的局限性(以及放弃 Object.observe), Vue无法检测属性添加或删除。
所以基本上简单来说,为了使数据值具有反应性并因此在API调用返回时更新,该属性必须在实例化时出现,因为 Vue无法检测到添加或删除强>
话虽如此,你可以像@gskema通过使用占位符对象并将属性附加到该对象那样伪造它。这些变化确实会被Vue接受。
所以你可以这样做:
data: {
api: null
}
然后在返回时将api值附加到api
属性,最后只需api.number
等引用所有数据。