<template><el-form ref="container"><el-form-item><el-input v-model="inputValue" placeholder="请输入内容"></el-input></el-form-item></el-form>
</template><script setup>
import { ref, onMounted, onUnmounted } from 'vue';
import { ElForm, ElFormItem, ElInput } from 'element-plus';const inputValue = ref('');
const container = ref(null);onMounted(() => {const handleKeydown = (event) => {if (event.key === 'Enter') {console.log('回车键被按下了！');}};// 通过 $el 获取组件的底层 DOM 元素if (container.value && container.value.$el) {container.value.$el.addEventListener('keydown', handleKeydown);}onUnmounted(() => {if (container.value && container.value.$el) {container.value.$el.removeEventListener('keydown', handleKeydown);}});
});
</script>

 container.value.addEventListener is not a function 错误，是因为 container 作为 el - form 组件的 ref，container.value 拿到的是组件实例，而非原生 DOM 元素，而 addEventListener 是原生 DOM 元素的方法。
你若写成 container.value.addEventListener 就会报错。正确做法是使用组件实例的 $el 属性获取底层 DOM 元素，然后再添加事件监听器。