El componente de entrada en elementUi ingresa para activar el problema y la solución de actualización de la página
Tecnología: marco de interfaz de usuario de vue3 + element plus
Hoy hice una pequeña función, que es un cuadro de entrada basado en el marco elementUi, que necesita monitorear el evento de retorno de carro del cuadro de entrada y luego llamar a la interfaz.
El código se muestra a continuación:
<el-form :model="from" :inline="true">
<el-form-item label="身份证号">
<el-input
v-model="from.idCard"
placeholder="请输入身份证"
clearable
prefix-icon="Search"
maxlength="18"
show-word-limit
autofocus
style="width: 260px"
@change="selectIdCard"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="selectIdCard">确定</el-button>
</el-form-item>
</el-form>
Después de presionar Enter en el cuadro de entrada, la página se actualizará. Los motivos de la consulta son los siguientes
solución:
Además , el cuadro de entrada se puede utilizar para monitorear el evento de retorno de carro el-form.@submit.prevent@keyup.enter
<el-form :model="from" :inline="true" @submit.prevent>
<el-form-item label="身份证号">
<el-input
v-model="from.idCard"
placeholder="请输入身份证"
clearable
prefix-icon="Search"
maxlength="18"
show-word-limit
autofocus
style="width: 260px"
@keyup.enter="selectIdCard"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="selectIdCard">确定</el-button>
</el-form-item>
</el-form>
La captura de pantalla después del retorno de carro es la siguiente
