vue页面rules规则校验清除方法
前端规则校验清除方法
·
//rules规则校验清除 this.$refs.ruleForm.resetFields();
ruleForm为中的ref属性值:<el-form ref="ruleForm">
HTML例子:
<div v-show="!showList">
<div class="panel-heading">{{title}}</div>
<el-form label-width="80px" :model="rule" :rules="rules" ref="ruleForm">
<el-form-item label="名称" prop="name">
<el-input v-model="rule.name" placeholder="名称"></el-input>
</el-form-item>
<el-form-item label="类型" prop="type">
<el-select v-model="rule.type" style="width: 100%">
<el-option
v-for="item in list"
:key="item.code"
:label="item.name"
:value="item.code*1">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="字段" prop="field">
<el-select v-model="rule.field">
<el-row v-for="item in rulefieldList" :key="item.code">
<el-col :span="12">
<el-option :value="item.code"></el-option>
</el-col>
<el-col :span="12">
<el-option :value="item.code"></el-option>
</el-col>
</el-row>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="saveOrUpdate">保存</el-button>
<el-button type="warning" @click="reload">返回</el-button>
</el-form-item>
</el-form>
</div>
CSS例子如下:
//返回按钮
reload: function () {
vm.showList = true;
//rules校验清除
this.$refs.ruleForm.resetFields();
}
更多推荐
已为社区贡献1条内容
所有评论(0)