Vue父组件如何调用子组件（弹出框）中的方法的问题

如果子组件是一个弹出框，只有在触发某个点击事件时弹出框才能出现（也就是说在父组件中的子组件使用上用了v-if），那在父组件上如果不点击弹出框是不能获取到$ref的。原因就是：引用指向的是子组件创建的实例，可以理解为绑在了DOM结构上那如果我偏偏想调用的是这个子组件（弹出框）中的方法，但又不想要弹出框显示，怎么办呢？解决方法：把v-if换成v-show，这样DOM元素会一直存在于父组件...

weixin_30569033

2707人浏览 · 2019-06-08 11:39:00

weixin_30569033 · 2019-06-08 11:39:00 发布

如果子组件是一个弹出框，只有在触发某个点击事件时弹出框才能出现（也就是说在父组件中的子组件使用上用了v-if），那在父组件上如果不点击弹出框是不能获取到$ref的。

原因就是：引用指向的是子组件创建的实例，可以理解为绑在了DOM结构上
那如果我偏偏想调用的是这个子组件（弹出框）中的方法，但又不想要弹出框显示，怎么办呢？
解决方法：把v-if换成v-show，这样DOM元素会一直存在于父组件中，子组件的方法也就能调用了

转载于:https://www.cnblogs.com/zsg88/p/10990298.html

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^