Vue.js 从父vue修改子数据

我有一个组件，它在表单中表示一个选项，数据表示当前选定的选项。有一个表示完整表单的父组件，带有一个提交按钮和一个重置按钮。我通过从子级向父级发送事件来跟踪表单中当前选择的选项（这很重要，因为表单会动态更新）

---

我正在尝试设计重置按钮，它将清除表单中的所有字段（将当前选择的选项设置为空字符串）。我需要修改子组件的数据。我是否应该使用Vue实例作为总线来执行此操作？这似乎太过分了。有没有更好的方法来设计这些组件？

您可以创建一个自定义事件来侦听每个表单字段上的重置按钮。查看此文档

我认为您希望在传递到子组件的属性上使用sync。我使用它来加载我的子组件，如：

 <textbox :content.sync="new_comment" placeholder="Add a comment..."></textbox>

---

如果您已经从子组件发射，则对新注释的更改将自动通过

只需在子对象中放入一个方法，可能是清除的，然后从父对象调用它。您可以在父对象中使用$refs来访问子对象。

您可以找到很多方法来实现这一点

对我来说，在玩了很多道具之后，我发现最好最安全的方法就是使用它。$refs

---

即使有多个子组件具有相同的ref名称，也可以使用forEach遍历每个子组件。

通过从子组件向父组件发送事件来跟踪子数据，但是什么类型的事件？您是否通过

v-model

使用双向绑定？从父级->子级发出事件不被视为反模式吗？我希望有更好的设计。我相信你们不能向孩子们发射，实际上我看了参考，但它看起来不是很动态。孩子们的数量在不断更新，而且似乎很难跟踪refs。您可以迭代所有$ref，然后对每个$ref进行清除。将空白函数放在那些什么都不做的函数中。这非常有效，谢谢。如果您给某些子项指定一个特定的ref标记（例如，标记所有表单选项“form option”），那么您只能使用该标记遍历父项中的那些子项。$refs.form-option应该是所有子项的数组。我不知道您可以使用相同的名称，但效果非常好。很高兴能提供帮助。添加一个示例或至少一个示例链接