vue: el-form只校驗部分欄位

validateField用法

瀏覽器debug發現，每個欄位，都會單獨校驗並返回校驗結果；失敗時，返回使用者定義的錯誤提示資訊；校驗透過返回空串

方法一：

  // 欄位教校驗時，每個欄位都會單獨校驗一遍，將結果儲存到陣列中
  let validateFields = ['username', 'password', 'confirmPassword']
  let validateFieldsRs = []
  this.$refs.formName.validateField(validateFields, (valid) => {
    // 欄位校驗成功則返回空串
    if (!valid) {
      validateFieldsRs.push(valid)
    } else {
      return
    }
    // 資料元素個數和欄位個數一致時，校驗結束且都是成功的
    if (validateFields.length == validateFieldsRs.length && validateFieldsRs.every((item) => item === '')) {
      // 其他處理業務邏輯
    }
  })

方法二：

      Promise.all(validateFields.map((item) =>
          new Promise((resove, reject) => {
            // 返回校驗結果
            this.$refs.formName.validateField(item, (err) => resove(err))
          })
        )
      ).then((res) => {
        // 過濾所有的非空串的，存在非空串表示校驗不透過的
        if (res.filter((item) => item).length) {
          return
        }
        // 校驗透過後，業務邏輯
      })