问题描述:在table页面修改数据后,想刷新页面。修改页面以子组件的形式写的,现在想在子组件里面调用父组件的方法实现页面刷新!

将问题google后,以下两种方法都尝试过了,但是不起作用......大家可以先试试这些方法。如果还没解决。就请往下看

后来问了前端同事,看她是这样给我操作的。由于我只是看得懂前端代码,会改一点点,没多少经验,所以想将这种解决问题的方法记录下来!

先使用console.log(this)将页面上所有的方法、参数,组件等打印到控制台

然后在控制台找对应的父组件,我的table页面的ref="tableRef";

再点击$refs下挂载的组件,找到tableRef。

点开tableRef,可以看到有一个refresh方法。就使用这个方法就可以实现页面刷新

最后写法:

vue父子组件,子组件调用父组件方法的更多相关文章

  1. vue 简单实现父组件向子组件传值,简单来说就是子组件肆意妄为的调用父组件里后台返回的值

    首先在于父子组件传值的方法很多,本人在这里只是简单描述一下一个组件里面引用了子组件,那么子组件如何才能获取父组件中后台返回的值呢? 首先调用组件相信大家都应该明白了(不明白的自己撸撸文档), < ...

  2. js 子窗口调用父框框方法

    父窗口 子窗口

  3. 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法

    一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...

  4. vue:父子组件间通信,父组件调用子组件方法进行校验子组件的表单

    参考: ElementUI多个子组件表单的校验管理:https://www.jianshu.com/p/541d8b18cf95 Vue 子组件调用父组件方法总结:https://juejin.im/ ...

  5. vue 子组件调用父组件的方法

    vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...

  6. Vue 子组件调用父组件方法

    父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...

  7. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  8. Vue 子组件调用父组件 $emit

    <!DOCTYPE html><html>    <head>        <meta charset="utf-8">      ...

  9. vue 子组件调用父组件的函数

    子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件.附加参数都会传给监听器回调. 子组件 <template> <div> ...

  10. vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法

    1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...

随机推荐

  1. c语言container_of 编译报错

    求指针ptr所在的结构体实例的首地址, #define offsetof(TYPE, MEMBER) ((size_t) &((TYPE *)0)->MEMBER) #define co ...

  2. vue ref用法

    <div class="myClass" ref="diva"></div> // 给dom节点添加ref this.$refs.div ...

  3. 可收集ALC问题[A non-collectible assembly may not reference a collectible assembly.]

    ITask程序集在共享类库中定义,初衷是任务调度程序,创建新的可卸载ALC以供每一个任务运行,此时会出现两个问题: 任务调度程序加载了任务程序后,任务程序中的ITask类型和任务调度程序中的ITask ...

  4. weboack5webpack5用url-loader(file-loader)处理字体

    file-loader(url-loader)可以用解析打包字体. webpack配置loader \\ webpack.config.js const webpack = require(" ...

  5. 赤菟V307与Matlab的串口通信

    赤菟V307与Matlab的串口通信 赤菟V307(CH32V307)是一款RISC-V内核的MCU,搭载的是沁恒自研RISC-V内核青稞V4F,最高主频144MHz,支持单精度浮点运算(FPU). ...

  6. NDK 减少 so 库体积方法总结

    . 使用 strip 使用 NDK toolchain 可以把调试的 C++ 符号表(Symbol Table)中数据删除,我们一般我们打成 APK 会自动帮我们做这个工作,当然也可以手动设置: 手动 ...

  7. jmeter分布式压测配置

    首选 压力机A,压力机B,压力机C,   压力机A作为控制台    压力机B,压力机C作为分布式的测试机 压力机Aip:172.16.23.69, 压力机Bip:192.168.184.128 压力机 ...

  8. 解决在高分屏电脑上的vmware,linux系统的显示比例不正确的问题

    除了在虚拟机系统内改变显示比例为200%的方法,还有另一种方法: 编辑虚拟机设置--硬件--显示器--指定监视器设置,选择任意监视器的最大分辨率为1920x1080(或者比例保持不变的其他分辨率,例如 ...

  9. HDMI基础知识

    小插曲: HDMI代表TV阵营(2002年发布,抢占市场先机) DP1.2/1.4/2.0代表电脑阵营(2006年发布,电脑厂家不想受制于TV) 由来: HDMI(High-Definition Mu ...

  10. VUE基础 · 绑定(1)

    前端三大框架:Angular.js.React.js.Vue.js,目前最热的是Vue,并且使用的热度还在递增中. Vue已经将操作页面的方法封装好,我们只需要对数据进行修改就可以完成页面的显示.Vu ...