Vuejs 里面在父组件通过$refs.childComp.xxx 改变子组件 state 或者调用方法 很常用么？

[lifesimple]

比如 dialog 弹框 之前 react 最常见的写法就是传个 visible prop 来空值显示隐藏，vue 也是这么写，后面看别人的代码里经常就 this.$refs.xxxDialog.visible = true 或者 this.$refs.xxxDialog.open() 直接处理子组件的状态，而不是通过传 prop 的方式，我感觉这样写确实更方便。

这种处理方式是不是也比较常见？有没有什么弊端这么写的话

[lifesimple]

@jrtzxh020 如果只是打开的话 直接 @click='$refs.xxxDialog.visible = true' 感觉这么直接控制其他组件的 state 写起来确实要比传 prop 顺手点

[sjhhjx0122]

@wunonglin vue2 也可以的，用 Vue.extend 创建就好了，我也是主用 ng ，依赖注入我还没遇到你说的这个问题

[wangtian2020]

我都是这么写的
this.$refs['childDialogComponent'].showAddDialog(params)
调用子组件方法，子组件执行自己的方法修改自身状态

[wunonglin]

@sjhhjx0122 #22

看到了。简单看下 vue2 的文档，好像可以用 render 创建组件，然后在 context 把 ref 和 data 放进去，有时间我再试试。
好难受。

[sechi]

大部分时候都是用 this.$refs.xxxDialog.open()，反正大部分时候都是写 crud 业务，真的没有那么多条条框框，怎么舒服怎么来

[AlphaTr]

简单一个调用 result = await this.$refs.dialog.open(params) 直接将给 Dialog 传参数并打开、获取弹窗的返回值都做了；比通过给组件传 props ，然后监听组件的事件这样子分布在各处的方式个人感觉更好些

[snarkprayer]

ref 引用读数据调方法可以，写数据应该禁止
$refs.ddialog.open()这种的可以加一层封装 点击 trigger slot 显示
```
<Extend-Modal>
<content-compoennt />
<button slot="trigger">按钮</button>
</Extend-Modal>
```

[ymcz852]

看那么多人支持 $refs 去调用子组件方法有点惊讶，虽然方便，但个人认为除了用 $refs 去调用第三方组件的方法的场景外，这种方法带来的可维护性肯定不佳的，子组件根本不知道有哪些父组件调用了它的方法，一旦是改动了这些方法就难搞了

[jdi]

官方是不推荐的，原来开了个口子，现在把口子缩小了点：
> 使用了 <script setup> 的组件是默认私有的：一个父组件无法访问到一个使用了 <script setup> 的子组件中的任何东西

[humbass]

如果是 Alert 、Loading... 这样的框，最好是用 extend 封装一层，然后用函数调用，这样就完全解耦了。

vue2 的写法 ： https://joyran.github.io/yi-blog/blog/alert.html （随便搜的）

[thtznet]

两种不通的思想，面向对象的写法和数据驱动，Vue 嘛，既然得了 2 者的优势就会有带着 2 者的影子，所以感觉有点不伦不类。

[dengshen]

sync 不好用吗？

[xsldebugger0030]

@wunonglin vue 的设计模式决定了你有 n 种方式打开弹窗。不需要调内部方法或修改内部属性。直接把 dialog 的 visible 绑定到 prop 里，由父组件控制就好了。

[wunonglin]

@xsldebugger0030 #33 笑了

[xsldebugger0030]

@wunonglin https://www.v2ex.com/help/assertive
我们希望能够在 V2EX 建立和倡导一种好好说话的氛围。

请尽量描述事实，而非观点。
如果你要反驳什么，请反驳那个主要的要点，而不是一些旁枝末节。
如果你要说的话是为了伤害别人，那么请不要说。如果你要说的话，你有预感在将来你会想要删掉它，那你最好现在就不要说。
在一个公共空间的公共讨论中，我们应该关注的，是自己能够在这些讨论中提供什么样的建设性增益，而不是那些纯粹个人的感受。比如当大家在讨论一件你不了解的东西时，你没有必要去回复一条“不明觉厉”。
回忆一下你看过的电影里的那些正面角色的说话方式——把一件事情好好陈述出来，没有冷笑，没有嘲讽，没有反问，就只是好好说话而已。