Vue.js - 如何被动地将“多级嵌套”成员添加到对象

Question

我在 web 项目中使用 vue.js 版本 2。

我知道反应性对向对象添加新成员有一些限制。

也就是说，我正在处理一个相对复杂的数据对象，它具有大量嵌套成员、子对象数组等。

我现在使用计算属性来获取/设置特定组件中的一些成员，并且我正在使用 lodadh 获取/设置这些嵌套属性 _.set

例如： _.set(myObj, 'GeneralData.Body[0].MainAddress.StreetNumber')

我的问题是，除了GeneralData，其余部分不可能存在，因此整个事情不是反应性的。

我怎样才能在 vue.js 中实现这一点？我尝试使用$setvue.js 提供的函数，但它创建了一个名为“GeneralData.Body[0].MainAddress.StreetNumber”（作为字符串）的嵌套属性，而不是作为 lodash 函数的对象树。

Answer 1

您可以使用_.setWithwhich 来告诉您使用哪个lodash函数来创建道具。

因此，您的问题的解决方案将如下所示：

_.setWith(myObj, 'GeneralData.Body[0].MainAddress.StreetNumber', 'somevalue', function(nsValue, key, nsObject){
 return Vue.set(nsObject, key, nsValue)
})

参考：

https://lodash.com/docs/4.17.11#setWith

https://vuejs.org/v2/api/#Vue-set