Question

我有一个Client组件，其中包含ClientInfo和ClientForm组件。客户端的数据中包含client，并将其作为支柱传递给表单和信息。在ClientForm组件内部，我有一个处理后端的方法。现在，当我尝试这样做时：

axios.put(url, body).then(res => {
  this.client = res.data
})

我收到有关直接改变道具以及我不应该如何做的错误消息。现在我这样做：

axios.put(url, body).then(res => {
  Object.keys(res.data).forEach((i) => {
    if(this.client[i] != res.data[i]){
      this.client[i] = res.data[i]
    }
  })
})

这似乎......很好的次优。

是否有更好的方法来处理从client更新ClientForm对象，以便ClientInfo组件获取新信息？

Answer 1

您可以使用新数据发出自定义事件：

axios.put(url, body).then(res => {
  this.$emit('client', res.data)
})

...然后在客户端父组件中对该事件做出反应以更新其状态：

<ClientForm @client='(data) => client = data' />

我希望这会有所帮助。

更新组件内的Vue Prop

1 个答案: