一、通过ref绑定,话不多说,直接上代码。
<template>
<el-input ref="dom" />
<template>
<script lang="ts">
import { defineComponent, onMounted, ref } from "vue";
export default defineComponent({
setup() {
const dom = ref<HTMLElement|null>(null);
onMounted(()=>{
dom.value.focus();
})
return {
dom
}
}
})
</script>
二、通过函数绑定的方式操作dom
<template>
<el-input :ref="dom" />
<template/>
<script lang="ts">
import { defineComponent, onMounted, ref } from "vue";
export default defineComponent({
setup() {
let refs: HTMLElement;
const dom = (el: HTMLElement) => {
refs = el;
};
onMounted(() => {
refs.focus();
});
return {
dom,
};
}
})
</script>