vue 验证用户名是否已存在

问题：异步函数如何执行完再执行下一步

解决：最好写在一个异步函数中

 代码：

  rules: {
        name: [{ validator: this.usernameRules, trigger: 'blur' }]
      }

 // 验证用户名是否存在
    usernameRules(rule, value, callback) {
      if (this.title === '新增角色') {
        validForm(this.orgId, this.AddRoleList.name).then((resp) => {
          if (resp.data.length === 1) {
            this.repName = 1
          } else {
            this.repName = 0
          }
          if (value === '') {
            callback(new Error('角色名称不能为空！'))
          } else if (this.repName === 1) {
            callback(new Error('该角色已存在！'))
          } else {
            callback()
          }
        })
      }
      if (this.title === '编辑角色') {
        validForm(this.orgId, this.EditRoleList.name).then((resp) => {
          if (resp.data.length === 1) {
            if (resp.data[0].id === this.EditRoleId) {
              this.repName = 0
            } else {
              this.repName = 1
            }
          } else {
            this.repName = 0
          }
          if (value === '') {
            callback(new Error('角色名称不能为空！'))
          } else if (this.repName === 1) {
            callback(new Error('该角色已存在！'))
          } else {
            callback()
          }
        })
      }
    }

要点：

1、新增中：只需要看用户名的name是否存在

2、编辑中：查看name后还要查看id,(如果id相同说明修改的是当前数据，名字可以重复，等于没有改动，如果id不同说明跟其他的用户的名字重复了)