位置: IT常识 - 正文

vue 父组件调用子组件方法ref(vue 父组件调用子组件效果)

编辑:rootadmin
vue 父组件调用子组件方法ref 一、ref被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的$refs对象上

推荐整理分享vue 父组件调用子组件方法ref(vue 父组件调用子组件效果),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vue父组件调用子组件里面的方法,vue 父组件调用子组件效果,vue父组件调用子组件里面的方法,vue父组件调用子组件的方法并传参,vue父组件调用子组件的方法并传参,vue父组件调用子组件里面的方法,vue父组件调用子组件的方法并传参,vue父组件调用子组件的方法并传参,内容如对您有帮助,希望把文章链接给更多的朋友!

vue中如果父组件想调用子组件的方法,可以在子组件中加上ref,然后通过this.$refs.ref.method调用。

父组件:

<template> <div @click="fatherMethod"> <orderchild ref="child"></orderchild> </div></template><script> import orderchild from '~/components/orderchild.vue'; export default { components: { orderchild }, methods: { fatherMethod() {this.$refs.child.childMethods(); } } };</script>

 子组件:

<template> <div>{{name}}</div></template><script> export default { data() { return { name: '测试' }; }, methods: { childMethods() { console.log(this.name); } } };</script>

在父组件中, this.$refs.child 返回的是一个vue实例,可以直接调用这个实例的方法

二、在vue2.0和vue3.0中,ref方法有一些变化:

vue2.0 父组件

vue 父组件调用子组件方法ref(vue 父组件调用子组件效果)

<Table ref="eleTable" @handle="handleFun"></Table>

methods: 

this.$refs.eleTable.子组件的方法名+()

this.$refs.eleTable.子组件的属性名

vue3.0 父组件

  <Table ref="eleTable" @handle="handleFun"></Table>

import {  ref  } from 'vue'

setup() {     //ref方法     const eleTable = ref()  //eleTable是页面ref后面对应的名字     const clickSon = () => {       eleTable.value.changeShowText() //调用子组件的方法       let arr = eleTable.value.tableData //获取子组件 setup 里面定义的变量     } }

参考:vue3.0中使用ref来调用子组件的方法_普通网友的博客-CSDN博客_ref调用子组件方法 

本文链接地址:https://www.jiuchutong.com/zhishi/298456.html 转载请保留说明!

上一篇:Web过滤器:Filter(web过滤器的常见应用)

下一篇:Pytorch训练模型损失Loss为Nan或者无穷大(INF)原因(pytorch训练模型计算f1)

  • 苹果手机如何解除200m限制(苹果手机如何解除呼叫限制)

    苹果手机如何解除200m限制(苹果手机如何解除呼叫限制)

  • 5g消息是什么意思(5g消息是什么意思是短信吗)

    5g消息是什么意思(5g消息是什么意思是短信吗)

  • y7s和y5s的区别(y5s和y7s的外形区别)

    y7s和y5s的区别(y5s和y7s的外形区别)

  • 拼多多怎么提升访客量(拼多多怎么提升权重)

    拼多多怎么提升访客量(拼多多怎么提升权重)

  • qq音乐怎么下载(qq音乐怎么下载免费歌曲)

    qq音乐怎么下载(qq音乐怎么下载免费歌曲)

  • 拼多多砍价必须是微信好友吗(拼多多砍价必须购买砍价商品吗)

    拼多多砍价必须是微信好友吗(拼多多砍价必须购买砍价商品吗)

  • 快手为什么自动取消关注别人(快手为什么自动关注别人)

    快手为什么自动取消关注别人(快手为什么自动关注别人)

  • 触屏不灵敏是什么原因造成的(触屏不灵敏是什么跟地线原因造成的呢)

    触屏不灵敏是什么原因造成的(触屏不灵敏是什么跟地线原因造成的呢)

  • 账单为什么要人脸识别(账单为什么要人工审核)

    账单为什么要人脸识别(账单为什么要人工审核)

  • 如何更换微信的实名认证(如何更换微信的手机号码)

    如何更换微信的实名认证(如何更换微信的手机号码)

  • 惠普电脑怎么截图全屏(惠普电脑怎么截图快捷键)

    惠普电脑怎么截图全屏(惠普电脑怎么截图快捷键)

  • oppo怎么强制分屏(oppo手机如何强行分屏)

    oppo怎么强制分屏(oppo手机如何强行分屏)

  • vivo x27录屏为什么没有声音(vivo录屏为什么出来是黑屏)

    vivo x27录屏为什么没有声音(vivo录屏为什么出来是黑屏)

  • iphone11和pro的对比(iphone11对比pro)

    iphone11和pro的对比(iphone11对比pro)

  • 天猫魔屏怎么对焦(天猫魔屏怎么联网)

    天猫魔屏怎么对焦(天猫魔屏怎么联网)

  • 手机qq怎么开启免打扰(手机QQ怎么开启漫游)

    手机qq怎么开启免打扰(手机QQ怎么开启漫游)

  • vivo27来电铃声怎么设置(vivo来电铃声怎么设置方法)

    vivo27来电铃声怎么设置(vivo来电铃声怎么设置方法)

  • oppo手机计算器的百分比在哪里(oppo手机计算器在哪里找)

    oppo手机计算器的百分比在哪里(oppo手机计算器在哪里找)

  • iphone x 分屏多任务(苹果x能分屏两个任务)

    iphone x 分屏多任务(苹果x能分屏两个任务)

  • qq怎么设置密码锁屏(qq怎么设置密码才能进入)

    qq怎么设置密码锁屏(qq怎么设置密码才能进入)

  • word首行缩进怎么设置(word2019 首行缩进)

    word首行缩进怎么设置(word2019 首行缩进)

  • iPhone6自带的健康软件怎么把英里换成公里?(iphone6按键功能介绍)

    iPhone6自带的健康软件怎么把英里换成公里?(iphone6按键功能介绍)

  • Android 设置Padding和Margin(动态/静态)(android 设置按钮颜色)

    Android 设置Padding和Margin(动态/静态)(android 设置按钮颜色)

  • 【图文教程】怎么在Mac OS X 10.10与 iOS8 之间使用Handoff?(教程图怎么做)

    【图文教程】怎么在Mac OS X 10.10与 iOS8 之间使用Handoff?(教程图怎么做)

  • Nodejs快速搭建简单的HTTP服务器,并发布公网远程访问(node.js环境搭建)

    Nodejs快速搭建简单的HTTP服务器,并发布公网远程访问(node.js环境搭建)

  • 承兑汇票用开发票吗
  • 公司购买汽车的折旧年限
  • 暂估材料收到发票后是更正还是红冲
  • 教育费附加免税政策
  • 销货方违规作废增值税专用发票怎么处理
  • 个人转让住房要交哪些税费?
  • 简易征收和简易计税的区别
  • 工会经费按什么计算的
  • 销售机械设备的税率是多少
  • 所得税汇算清缴后发现有误怎么办
  • 认证后的发票可以留抵下月抵扣吗
  • 钢结构制作安装合同
  • 乐器的税率
  • 营改增后房屋租赁如何纳税
  • 相关税费计入哪里
  • 在产品的成本
  • 转登记日下期指的是什么
  • 预提厂房租金
  • 苹果mac系统桌面空间不够
  • php中面向对象
  • 外销收入含税吗
  • dell oemdrv
  • php yeid
  • 简明易懂的
  • php header refresh
  • 【机器学习面试总结】————(一)
  • php执行另一个php
  • 没有发票的支出可以扣除企业所得税么
  • 直播服务费的开票大类
  • 好用的微信小程序邮箱有哪些
  • 什么是代缴代扣
  • sql函数判断一个值是否是数字
  • 金税四期对企业纳税管理影响分析
  • 结算价格的确定原则
  • 服务型企业要缴哪些税
  • 建安工程预缴税额怎么算
  • 服务业小规模纳税人全套做账
  • 应收账款的明细科目一般按照什么设置
  • 主营业务成本里的工资
  • 购买员工团体意外险需要缴纳个税么
  • 待认证进项税额是二级科目还是三级科目
  • 给股东分利润怎么做账
  • 收到投资款现金流量
  • 营改增之后还有营业税金及附加吗
  • 普通发票怎么开?
  • 固定资产折旧怎么算
  • 公司现金收入存入私人老板账户
  • sql数据库检查
  • 设置密码保护的pdf怎么转word
  • 自己动手制作
  • centos挂载点
  • 设置u盘为只读
  • w10强制更新怎么关闭
  • xp系统如何设置用户密码
  • 自动保存怎么恢复
  • Mac Chrome打开HTTPS证书错误问题解决方法
  • 64位win10预览版10565更新补丁KB3105208后蓝屏怎么办?
  • ConquerCam.exe进程的详细介绍 ConquerCam进程信息介绍
  • ubuntu 04 10
  • win7 64位系统提示"Windows7不能识别网络打印机"的故障原因及解决方法
  • Win7系统电脑开不开机怎么办
  • win8怎么更新到win8.1
  • 怎么用windows
  • android搭建环境
  • cocos creator js教程
  • ai控制器的简称是
  • dos强制删除文件命令
  • jquery源码分析笔记
  • Node.js中的事件循环是什么
  • 打开指定文件夹命令
  • 在指定目录查找的文件
  • socket教程pdf
  • js对象用法
  • js中的类是什么
  • 打印个人住房信息查询记录需要什么资料
  • 滴滴收入统计
  • 非正常户记录
  • 在企业内部具有行使否决权的是
  • 柳州 税务
  • 耗电异常优化是什么意思微信
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设