使用 Vuelidate 验证器之间的动态范围

Question

我目前有数据属性

data() {
  return {
    stats: {
      limit: 100,
      score: 0
    }
  }
}

然后我希望我的验证介于 0 和数据属性的 limit 值之间我目前正在使用 Vuelidate 来验证属性。

import { required, between } from "vuelidate/lib/validators";

validations: {
  stats: {
    score: {
      between: between(0, this.stats.limit)
    }
  }
}

但这目前不起作用。我目前正在 Cannot read property limit of undefined

Answer 1

vuelidate 验证器的上下文不是组件实例。但是，由于 vuelidate 通过函数上下文传递组件上下文，您可以将其替换为自定义函数。

import { required, between } from "vuelidate/lib/validators";

function customBetween(value) {
  return between(0, this.stats.limit)(value)
}

validations: {
  stats: {
    score: {
      between: customBetween
    }
  }
}

使用 Vuelidate 验证器之间的动态范围

Dynamic range using Vuelidate's between validator

javascript

vue.js

vuelidate