首页 > 解决方案 > 从 vue3 中的 v-on 事件处理程序访问元素

问题描述

我需要在 vue 中访问组件的元素并不少见。例如在 element-plus 中,确保焦点被移除:

<el-button ref="btnLanza" @mouseleave="$refs.btnLanza.$el.blur()" @click="runLanza" round>Lanzar</el-button> 

在其他框架中,类似的东西on-mouseleave="this.blur()"就足够了,但在 vuethis中并没有指向元素,所以我需要定义一个 ref 然后遍历 $refs,仅用于这个小任务。

是否有替代$this来访问捕获事件的组件而不是定义模板的组件?

标签: vue.jsvuejs3element-uielement-plusel-plus

解决方案


尝试使用内联函数并使用目标模糊方法而不定义参考:

@mouseleave="($event)=>$event.target.blur()" 

要不就@mouseleave="$event.target.blur()"

受此启发


推荐阅读