如何异步验证Vuetify文本字段？

Question

Vuetify中的文本字段具有rules道具，这些道具采用返回的函数数组true或错误字符串。如何使它们异步，以便可以使用XHR在服务器端进行验证？

就像是：

<v-text-field :rules="[v => { axios.get('/check?value=' + val).then(() => { return true }) }]">

Answer 1

一种解决方案是设置error-messages道具：

<v-text-field v-model="input" :error-messages="errors">

并使用watch方法：

new Vue({
  data () {
    return {
      input: '',
      errors: []
    }
  },
  watch: {
    input (val) {
        axios.get('/check?value=' + val).then(valid => {
          this.errors = valid ? [] : ['async error']
        })
    }
  }
});