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

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

Vue父组件如何调用子组件(弹出框)中的方法的问题的更多相关文章

  1. 【vue】父组件主动调用子组件 /// 非父子组件传值

    一  父组件主动调用子组件: 注意:在父组件使用子组件的标签上注入ref属性,例如: <div id="home"> <v-header ref="he ...

  2. vue父组件如何调用子组件的属性或方法

    常常我们需要组件的拆分,就涉及到父子调用的关系,那么父组件如何调用子组件的属性和方法呢? 子组件child <template> <div> {{msg}} </div& ...

  3. 苹果手机iOS11中fixed弹出框中input光标错位问题

    最近遇到了一个移动前端的BUG:手机弹出框中的输入框focus时光标可能会错位. 刚开始时我完全不知道错误原因是什么,在电脑上调试时完全没有问题,手机上出现问题时也没有找到规律.后来在网上搜索了大量的 ...

  4. 在IOS11中position:fixed弹出框中的input出现光标错位的问题

    问题出现的背景: 在IOS11中position:fixed弹出框中的input出现光标错位的问题 解决方案 一.设计交互方面最好不要让弹窗中出现input输入框: 二.前端处理此兼容性的方案思路: ...

  5. 弹出框中选项卡的运用(easyUI)

    先看一下页面效果: 此处有两个知识点:一个是弹出框的运用,一个是选项卡的运用 分析一下该HTML代码,最外面一个div是弹出框的,默认是关闭状态,可通过ID来控制弹出框的开关,该div的样式是easy ...

  6. 弹出框中的AJAX分页

    $(function() { $("body").on("click",".set-topic",function(){ /*获取所有题目接 ...

  7. [ vue ] Quasar封装q-dialog组件,在外层实现弹出框的开启和关闭

    场景描述: 见:https://www.cnblogs.com/remly/p/12981582.html 具体实现: <!-- 父组件 --> <template> < ...

  8. python + selenium webdriver 通过python来模拟鼠标、键盘操作,来解决SWFFileUpload调用系统底层弹出框无法定位问题

    Webdriver是基于浏览器操作的,当页面上传文件使用的是flash的控件SWFFileUpload调用的时候,调用的是系统底层的文件选择弹出框 这种情况,Webdriver暂时是不支持除页面外的其 ...

  9. vue在element-ui的dialog弹出框中加入百度地图

    参考:https://blog.csdn.net/u012724595/article/details/82703579 <!-- gps弹窗 --> <el-dialog v-di ...

随机推荐

  1. vue-cli随机生成port源码

    const portfinder = require('portfinder'): const port = await portfinder.getPortPromise(): 两行代码 端口搜索范 ...

  2. Fiddler模拟响应

    1 启用规则 2 不匹配的规则通过,不勾选会导致不匹配的请求失败 3 匹配url 4 响应信息,Fiddler内置了一些响应脚步,你也可以选择一个保护响应信息的文本文件

  3. JavaScript深入浅出第3课:什么是垃圾回收算法?

    摘要: JS是如何回收内存的? <JavaScript深入浅出>系列: JavaScript深入浅出第1课:箭头函数中的this究竟是什么鬼? JavaScript深入浅出第2课:函数是一 ...

  4. 06、自动挂载+超级守护进程+时间同步+tcpwrapper+软硬链接+日志管理

    autofs  自动挂载服务   把下面这两条命令做成自动挂载 172.16.2.35:/share/soft /nfs/soft 172.16.2.35:/share/iso  /nfs/iso . ...

  5. JfreeChart 乱码问题处理

    在前面之间加上下面这段代码即可. //创建主题样式 StandardChartTheme standardChartTheme=new StandardChartTheme("CN" ...

  6. 逆向破解之160个CrackMe —— 022

    CrackMe —— 022 160 CrackMe 是比较适合新手学习逆向破解的CrackMe的一个集合一共160个待逆向破解的程序 CrackMe:它们都是一些公开给别人尝试破解的小程序,制作 c ...

  7. Xcode 10 无开发者账号通过无线网络真机调试

    Xcode是苹果公司向开发人员提供的集成开发环境,用于开发macOS.iOS.WatchOS和tvOS的应用程序.WWDC18全球开发者大会上,苹果发布了macOS Mojave beta测试版系统, ...

  8. 201671030129 周婷 实验十四 团队项目评审&课程学习总结

    项目 内容 这个作业属于哪个课程 软件工程 这个作业的要求在哪里 团队项目评审&课程学习总结 课程学习目标 (1)完成项目验收(2)反思总结课程学习内容 1.对<实验一 软件工程准备&g ...

  9. PHP将图片转base64格式函数

    base64的好处是什么?今天在跟小伙伴讨论这个问题,要是全站用Php把图片转为base64行不行? 1. 提升性能: 网页上的每一个图片,都是需要消耗一个 http 请求下载而来的, 图片的下载始终 ...

  10. 08-cmake语法-set()

    CMake的基本数据类型是字符串,一组字符串在一起称为列表(list) 用于设置变量. set(VAR a b c) # 输出 VAR = a;b;c VAR 就是一个list 参考: https:/ ...