Vue，Observable 上的过滤器属性答案

【问题标题】：Vue, filter property on ObservableVue，Observable 上的过滤器属性
【发布时间】：2019-08-03 02:49:32
【问题描述】：

我对 Vue 很陌生，我现在正在做的事情如下。

我在我的组件中收到一个 Item 道具，我将这个 Item 道具散布在我的组件中定义的 Form 数据对象上（有反应）

data() {
  return {
    form: {}
  }
mounted () {
  this.form = {
    ...this.item,
    translations: { ...this.item.translations }
  }
},

现在我的本地表单数据保存了信息，包括反应式翻译，对吧？

接下来我尝试做的是过滤这些数据，但它让我失望了。如果我控制台.log(this.form)。它是一个Observable（见截图）

有没有办法在这个“Observable”上过滤、减少、映射？我是否以正确的方式进行“反应”？

【问题讨论】：

你能展示过滤数据的代码吗？它是如何“失败”你的？错误信息？还是意外行为？

标签： javascript vue.js vuejs2

【解决方案1】：

您可以直接从data() 访问props。

data() {
  return {
    form: {
      ...this.item,
      translations: { ...this.item.translations }
    }
  }
},
computed: {
   getForm() {
     // use filter/map method here, e.g.
     // return this.form.filter((item) => { ... })
   }
}

【讨论】：

感谢您的提示，这是一个更简洁的代码，但是我无法适应、减少或使用该 observable 的问题仍然存在，有什么想法吗？
您可以过滤/减少/等。在computed: 属性中.. 它也是反应式的。
@SajibKhan form 不是Array，因此它没有filter 方法。
是的，这是一个示例，这意味着您可以在计算中对this.form 执行任何操作：-> getForm() 方法。

【解决方案2】：

在将项目分配给 this.form 之前尝试 clone/deepClone。

【讨论】：