vue兄弟组件通信？-灵析社区
复古直男如果多个组件见有互相控制的，那么使用自定义组件的 `v-model` 规则改造子表单，然后在父级直接用 `v-model` 绑定就可以了。其实就是 `props` \+ `$emit` 的方式。每次子表单修改之后兄弟表单也会同步到数据。 [#自定义组件的 v-model - 自定义事件 — Vue.js](https://link.segmentfault.com/?enc=UN%2B2620bvIh0Iole3lJ1Kg%3D%3D.59n5LbbaEuA21wwgrVrhlC%2FC8m6OOitZAJvOMJ1%2BVJas4V0RHYuOtKWPBHDAs9znnL7GfCbS%2Ffhv1Ggr2TUrCy%2BgGpUSOoOosocsag9FYaQ7cFrW6wvO12xPKvDaw4AssHpl3NUln9XcOqTe10QVK51eONXNQD4KXryRfNc4NWg%3D) * * * 当然如果不需要子组件之间的数据同步，也可以简单的在子组件写 `promisify` 的校验函数，在父级通过 `$refs.xx.onValid()` 来调用并且返回表单结果。多个子组件用 `Promise.all()` 来包裹，所有的校验函数都通过则继续执行。 onSubmit() { Promise.all([ this.$refs.compA.onValid(), this.$refs.compB.onValid() ]).then(([dataA, dataB]) => { ... }).catch(err => { ... }) } * * * 当然如果你是使用 `AntD Vue` 这样的UI组件库，也可以尝试直接在父级使用 `a-form` 在子组件直接使用 `a-form-item`，这样在父级触发数据收集的时候也可以直接获取到子组件的内容。 我在 `AntD4Vue 1.x` 的版本有尝试过，现在的 `3x` 和 `4x` 不清楚是否依然可以这样处理。 [笔记 - AntD of Vue 中 表单域组件化使用的尝试 ](https://link.segmentfault.com/?enc=1PnG1P1LWaqN7oDVrQnk4Q%3D%3D.Ir6UxGtRQWh9sZ%2Fl7kG%2BE1jl1uUdbqTnOgUmUfIiuK%2BVnDobmC%2FFavuSX9Ou5v1y3lX9LaD7QPUIg1Kis2vPiQ%3D%3D)