vue + elementui表单重置 resetFields问题(无法重置表单)
vue + elementui表单重置 resetFields问题(无法重置表单)
YXMBetter 发表于3个月前
vue + elementui表单重置 resetFields问题(无法重置表单)
  • 发表于 3个月前
  • 阅读 27
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

摘要: vue+elementui rules无效问题

问题:

  • elementui在重置表单时,无法使用this.$refs['formRefVal'].resetFields()清空表单数据;
  • elementui 设置rules后没有效果

解决方法:

  • 1、表单加ref属性
<el-form ref="refname"></el-form>
  • 2、form的每个item加prop属性(踩了好久的坑这个,需要和绑定数据的最后名称一致,prop属性添加到form-item上)
<el-form-item prop="name">
    <el-input v-model="query.name"></el-input>
</el-form-item>
  • 3、绑定点击事件中传入refname
<el-form-item>
    <el-button @click="resetForm('refname')">清空</el-button>
</el-form-item>
  • 4、注册事件
restForm(refname) {
   this.$refs[refname].resetFields()
}
  • 如果使用了$store.state.fm.plan管理关联表单数据,那么在form中需要添加:model="$store.state.fm"
  • 赶紧试试吧,可以的话记得点赞喽
共有 人打赏支持
粉丝 5
博文 134
码字总数 99452
×
YXMBetter
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: