VUE：校验名称是否存在会产生的问题

错误的校验函数：

// 验证名称是否已存在
    const validateNameExisted = (rule, value, callback)=>{
      if (!value) {
        callback(new Error("请输入名称！"))
      }
      check(this.entity).then(res => {
        if (!res.success) {
          callback(new Error("名称已存在"))
        } else {
          callback()
        }
      })
    }

错就错在不管是新增还是修改都校验了名称是否存在，实际上，新增时才需要校验名称是否存在，而修改时，我们禁止修改名称，因此不用校验名称。

正确的校验函数

// 验证名称是否已存在
    const validateNameExisted = (rule, value, callback)=>{
      if (!value) {
        callback(new Error("请输入名称！"))
      }
      if (this.titleStatus === 'create') { // 新增
        check(this.entity).then(res => {
          if (!res.success) {
            callback(new Error("名称已存在"))
          } else {
            callback()
          }
        })
      } else {
        callback()
      }
    }

注意：如果采用将this.rules.name = []，会导致修改时不校验，在点击新增按钮时也不会校验了。

---

感谢您的阅读，如果您觉得阅读本文对您有帮助，请点一下“推荐”按钮。本文欢迎各位转载，但是转载文章之后必须在文章页面中给出作者和原文连接。