element-ui和vue表单（对话框）验证提示语(残留)清除

form表单错误提示问题.png

//dialogFormVisible

//html
<el-dialog :title="title" :visible.sync="dialogFormVisible">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm">
          <el-form-item label="分类名称" prop="areaName" :label-width="formLabelWidth">
            <el-input v-model="ruleForm.areaName" autocomplete="off" style="width: 300px"></el-input>
          </el-form-item>
          <el-form-item label="状态" prop="status" :label-width="formLabelWidth">
            <el-radio-group v-model="ruleForm.status">
            <el-radio :label="1">启用</el-radio>
            <el-radio :label="2">停用</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="说明" prop="areaRemark" :label-width="formLabelWidth">
            <el-input type="textarea" v-model="ruleForm.areaRemark"  style="width: 300px"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="handleCancleClick">取 消</el-button>
          <el-button type="primary" @click="handleConfirmClick('ruleForm')">确 定</el-button>
        </div>
      </el-dialog>

watch: {
        dialogFormVisible: function (val,oldVla) {
          if (this.$refs['ruleForm'] !== undefined) {
            this.$refs["ruleForm"].resetFields();
          }
        }
      },

其他链接：https://blog.csdn.net/geming2017/article/details/83902514