vue3 使用 element-ui 的表单验证

441 阅读1分钟

由于Vue3中没有了$ref,也没有上this,所以只能通过正面的方法来使用。

<el-form :model="form" :rules="rules" ref="formRef" label-width="100px" class="form"></form>

<script>
setup(){
const formRef = ref(null);
// 表单的项一定要用reactive,否则checkbox组和raido组验证不会起作用。
const form = reactive({});

      const sumbitForm = () =>{
        console.log(form)
        console.log(formRef.value)
        formRef.value.validate((valid) => {
          if(valid){
            console.log('success')
          }
        })
      }
}
</script>