是否可以丢弃Vue实例中的数据错误?

时间:2016-11-10 20:35:32

标签: javascript vue.js

我将通过API调用修改Vue实例中的很多变量。他们的初始价值并不重要。

我希望在实例化vm时有一种方法来定义它们但是这不起作用:



vm = new Vue({
  el: "#app",
  data: {}
});
vm.number = 3

<div id="app">
  {{ number }}
</div>
&#13;
&#13;
&#13;

如果我将data: {}替换为data: { number: null },则代码运行正常。

我想避免的是一连串这样的声明 - 有没有办法在实例化时声明data变量?

1 个答案:

答案 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等引用所有数据。