el-dialog的取消重置数据操作，登录时表单全部校验

1.在<el-dialog> 标签中绑定关闭触发事件

<el-dialog v-model="editDialogVisible" title="修改用户" width="40%" @close="editDialogClosed">

2.在<el-form>标签中添加ref属性

<el-form :model="editForm" ref="editFormRef" label-width="80px">
                    

3.实现该方法

        //关闭重置表单
        addDialogClosed(){
            this.$refs.addFormRef.resetFields()
        },

 

登录时全部校验规则

1在登录表单中添加ref属性

<el-form  
    ref="formInline" 、
    :rules="formInlineRules" 
    :inline="true" 
    :model="formInline" 
    class="login_form"
>

2在methods中实现登录方法 

submitForm() {
    this.$refs.formInline.validate(async valid => {
        if (!valid) return;
        const {data: res} = await this.$http.post('login', this.formInline)
        if(res.meta.status !== 200) return this.$message.error("登录失败")
        this.$message.success("登录成功")
        window.sessionStorage.setItem("token",res.data.token);
        await this.$router.push("home")
    })
},