如果子组件是一个弹出框,只有在触发某个点击事件时弹出框才能出现(也就是说在父组件中的子组件使用上用了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. mybatis中集成sharing-jdbc采坑

    1. mybatis中集成sharing-jdbc采坑 1.1. 错误信息 Caused by: org.apache.ibatis.binding.BindingException: Invalid ...

  2. this(this的4种指向和改变this指向的方式)

    this是Javascript语言的一个关键字. 随着函数使用场合的不同,this的值会发生变化.但是有一个总的原则,那就是this指的是,调用函数的那个对象. 1.this指向的形式4种 a.如果是 ...

  3. PHP redis 常用操作

    //在列表头部插入一个值one,当列表不存在时自动创建一个列表,key1为列表名 $redis->lpush("key1", "one"); //在列表尾 ...

  4. 显卡,显卡驱动,nvcc, cuda driver,cudatoolkit,cudnn到底是什么?

    在使用深度学习框架的过程中一定会经常碰到这些东西,虽然anaconda有时会帮助我们自动地解决这些设置,但是有些特殊的库却还是需要我们手动配置环境,但是我对标题上的这些名词其实并不十分清楚,所以老是被 ...

  5. android 8.0 悬浮窗 最简demo

    MainActivity.java文件 package com.example.performance; import android.app.Activity; import android.con ...

  6. windows命令行模式打开目录

    cmd命令行里面,打开当前目录方式如下: explorer .

  7. java的excel表格的导出与下载

    今天做一个java对excel表格的导出和下载的时候,从网络上搜寻了下载的模板,代码如下: 控制层: @RequestMapping(value = "excelOut_identifier ...

  8. MacOS更改启动台(launchpad)图标大小

    原文链接:https://www.jianshu.com/p/18224d191bd2作者:麦壳君 小麦有点强迫症,觉得 Mac 启动台(Launchpad)里面系统默认的应用程序图标太大,所以想让它 ...

  9. Shell里的特殊符号

    Shell里的特殊符号: (1)单引号: 由单引号括起来的符号都作为普通字符处理,他们都失去了特殊意义. (2)双引号: 除美元符号($).倒引号.反斜线(\)仍保留特殊含义外,其余符号都作为普通字符 ...

  10. contest5 CF991 div2 ooooxx ooooox ooooox

    题意 div2D 给出一个棋盘, 有一些点不能放, 总共\(2\)排, 长度\(n(\le 100)\) 在上面空位摆放\('L'\)字形的牌, 问最多能放几个 例如: 00X00X0XXX0 0XX ...