当前位置: 首页 > news >正文

vue3自动暴露element-plus组件的ref

自动暴露子组件的方法,注意在TS下,需要自己声明类型,我这里全用any代替了

<template><el-button @click="getFocus">获得焦点</el-button><com ref="comRef" />
</template><script setup lang="ts">
import { ref } from 'vue'
import com from './components/com.vue'const comRef = ref(null);
const getFocus = () => {(comRef.value! as any).focus()
};
</script>

子组件

<template><el-input v-model="val" placeholder="请输入文本框" ref="inputRef" />
</template><script setup lang="ts">
import { ref } from 'vue'
import { InputInstance } from 'element-plus'const val = ref('');
const inputRef = ref<null | InputInstance>(null);defineExpose(new Proxy({}, {get(_target, key) {return (inputRef.value as any)?.[key];},has(_target, key) {return key in inputRef.value! as any;},
}))
</script>
http://www.lryc.cn/news/450401.html

相关文章:

  • 龙芯+FreeRTOS+LVGL实战笔记(新)——10蜂鸣器嘀嘀嘀
  • 微信小程序-数据模型与动态赋值
  • 【Redis】Linux下安装配置及通过C++访问Redis
  • Python 入门教程(4)数据类型 | 4.7、元组
  • Temu正在吸引越来越多的亚马逊卖家,这个市场Temu蝉联下载榜首
  • 设计原则模式概览
  • 高级主题:接口性能测试与压力测试
  • python绘制图像
  • 如何修复变砖的手机并恢复丢失的数据
  • 服务器使用了代理ip,遇到流量攻击,会对服务器有影响吗
  • 从存储到人工智能洞察: 利用 MinIO 和 Polars 简化数据管道
  • 只需要 1 分钟语音数据实现声音克隆
  • OpenEuler虚拟机安装保姆级教程 | 附可视化界面
  • 表格控件QTableWidget
  • LeetCode236题:二叉树的最近公共祖先
  • 虚谷中使用PL/SQL改变模式下所有表的大小写
  • 数据挖掘的基本步骤和流程解析:深入洞察与策略实施
  • BCJR算法——卷积码的最大后验译码
  • 系统架构设计师论文《论SOA在企业集成架构设计中的应用》精选试读
  • ceph rgw 桶分片之reshard
  • 开放原子开源基金会网站上的开源项目Opns存在缓冲区溢出缺陷
  • 未来前端发展方向:深度探索与技术前瞻
  • 前端工程规范-2:JS代码规范(Prettier + ESLint)
  • Tomcat为什么要打破双亲委派?怎么保证安全
  • 【C++篇】启航——初识C++(下篇)
  • Elasticsearch快速入门
  • uniapp微信小程序遮罩层u-popup禁止底层穿透
  • 【RocketMQ】秒杀设计与实现
  • 高级架构师面试题
  • phpstudy简易使用