位置: 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)

  • 税控盘退费怎么做会计分录
  • 消防工程改造怎么做账务处理
  • 代扣代缴增值税是什么意思
  • 中兴通抵扣官网
  • 虚假会计凭证的处罚
  • 内部资金往来科目
  • 押金计入什么费用
  • 将外购商品作为非货币性
  • 会员卡退钱是退全额吗
  • 产权转移书据印花税申报期限
  • 公司获得奖金计入什么科目
  • 增值税发票对方已认证怎么冲红
  • 补缴以前年度个税会计处理
  • 内部退养个税计算方式
  • 购买软件会计账务处理
  • 企业收入准则的主要内容
  • 客户付货款给我们公司备注往来结算款
  • 关于燃油消费税征收范围及税率
  • 公司贷款评估费的做账
  • 税务局减免的税金会计分录
  • 土地使用权对外出租还摊销吗
  • 项目结束,财务应该怎么做
  • 企业注销所得税汇算清缴
  • 个税手续费返还政策文件
  • 用友t3新账套总账设置
  • 如何查看本机的ip 网关 和dns配置
  • win7怎么运行在哪里设置
  • 报纸公示具有什么法律效应
  • 财务费用借方记负数的原因
  • 社保怎么计提
  • 个体户生产经营费用与家庭生活费用无法划分
  • 融资租入的设备为什么属于资产
  • 不能加载axf文件
  • 货款退回账务处理方法
  • 企业亏损还需要交增值税吗
  • 增值税加计抵减怎么算
  • 挂车车船税缴纳地点
  • 汽车4s店一般会摆放什么小零食
  • 税前弥补以前年度亏损
  • 企业转让专利权属于什么收入
  • 代扣代缴的企业所得税计入成本吗
  • 所得税费用要结转损益吗
  • 当月勾选认证可以在下月抵扣吗
  • python里eval的用法
  • 帝国cms商城教程
  • 分公司是独立的诉讼主体吗
  • 印花税会计处理办法
  • 注销公司需要承担什么责任
  • 营业外支出在贷方
  • 缴纳增值税附加税
  • 银行扣款能撤回吗
  • 物业公司管理费用都有哪些科目
  • 外购商品用于促销能抵扣吗
  • 行政单位误餐费标准
  • 固定资产竣工前予以资本化吗
  • 出口退税进项票跨月勾选
  • 已核销的坏账又收回时应当及时入账,防止形成账外款
  • 差旅费政策
  • 制造费用如何结转生产成本
  • 退回拨款会计分录怎么做
  • mysql第二章
  • MySQL数据迁移到oracle
  • FreeBSD下zfs: failed with error 6错误如何解决?
  • 苹果电脑如何提高网速
  • centos8 apache
  • window8系统安装步骤
  • ssh远程登录设置
  • 背包 ui
  • 如何实现js对象和json数据互转
  • 苹果macos安装
  • javascript高级编程
  • imageview tint
  • js实现文字闪烁的方法
  • python数学题
  • 月度申报如何改为季度申报
  • 税务工作创新
  • 上市公司的税务风险大吗
  • 扬州地方税务局在哪
  • 一般纳税人的进项票必须当月认证吗?
  • 城镇土地使用税暂行条例
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设