Vuetify - 如何在表单规则中访问数据 [英] Vuetify - How to access data in form rule

问题描述

我可以访问规则中的数据元素吗?

Can I access a data element in a rule?

这是我正在运行的代码

我正在尝试翻转 Vuetify 表单中文本字段规则上 data 元素的值.

I'm trying to flip the value of a data element on a text field rule in a Vuetify form.

规则本身工作正常，但是我无法访问数据元素，我收到此错误:

The rule itself works fine, however I'm unable to access the data element, I'm getting this error:

TypeError: 无法设置未定义的禁用"属性

这是我的代码:

data: function() {
return {
  disabled: false,
  rules:{
    sellerId(value){
      if(value.length == 0){
        this.disabled = true;
        return "What are you trying to do here?";  
      }
      else{
        return true;
      }
    }
  },

我做错了什么?

推荐答案

rules 是一个函数数组，如果你需要函数能够访问data属性，你可以将它们定义为组件方法:

rules are an array of functions, and if you need the function to be able to access data property, you can define them as component methods:

data: function () {
  return {
    disabled: false
  }
},
methods: { 
  sellerId (value) {
    if (value.length === 0) {
      this.disabled = true;
      return "What are you trying to do here?";  
    } else {
      return true;
    }
  }
}

然后在您的 Vuetify 组件中:

And then in your Vuetify component:

<v-text-field :rules="[ sellerId ]"></v-text-field>

这篇关于Vuetify - 如何在表单规则中访问数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！