Directorio de artículos
HTML
<el-form ref="refRuleForm" :model="formData" :rules="rules" label-width="120px" :size="formSize" status-icon>
<el-form-item label="标题" prop="title" maxlength="100" placeholder="请输入标题...">
<el-input v-model="formData.title" />
</el-form-item>
<el-form-item>
<template #default>
<div class="p_a r_0 m_t_20">
<el-button type="primary" @click="submitForm">提交</el-button>
</div>
</template>
</el-form-item>
</el-form>
mecanografiado
let refRuleForm = ref(undefined), formData: any = ref({ title: '', }), rules: any = reactive({ title: [ { required: true, message: '请输入标题', trigger: 'blur' }, { min: 2, max: 100, message: '标题字数应在2~100之间', trigger: 'blur' } ] }); function submitForm() { // 校验该表单项,如果不通过重新显示校验结果 refRuleForm.value?.validateField('title'); // 移除该表单项的校验结果 refRuleForm.value?.clearValidate('title'); }
vue3
azúcar sintáctica<script setup lang="ts"></script>
Cuando el elemento del formulario se verifica y se aprueba, el resultado de la verificación no se puede volver a mostrar.