element-ui表单初始化校验报红

在开发中,我们经常会遇到element-ui表单回显,初始化页面就报红的情况

解决方法:

在回显赋值的时候,加上以下代码就好啦

for (const key in this.baseinfo) {
  if (!this.baseinfo[key]) {
    this.baseinfo[key] = ''
  }
}
this.$nextTick(() => {
  this.$refs['editForm'].clearValidate()
})

完整代码:

async cmpBasic() {
  const data = { cmp_id: this.$route.query.cmp_id }
  const res = await cmpBasic(data)
  if (res.code == 200) {
    this.baseinfo = res.data
    this.$set(this.baseinfo, 'secondaryIndustryId', [])
    this.baseinfo.secondaryIndustry.map((i) => {
      this.baseinfo.secondaryIndustryId.push(i.id)
    })
    this.showTradeInfo = {
      primaryIndustryId: this.baseinfo.primaryIndustryId,
      secondaryIndustryId: this.baseinfo.secondaryIndustryId
    }
    this.baseinfo.cmp_province = res.data.cmp_province
    this.baseinfo.cmp_city = res.data.cmp_city
    this.baseinfo.cmp_county = res.data.cmp_county
    for (const key in this.baseinfo) {
      if (!this.baseinfo[key]) {
        this.baseinfo[key] = ''
      }
    }
    this.$nextTick(() => {
      this.$refs['editForm'].clearValidate()
    })
  }
}

 this.$refs.editForm.clearValidate()

你可能感兴趣的:(javascript,前端,vue.js,elementui)