规则应该 return 一个字符串或布尔值，当使用多个规则时收到 'object'

Question

我正在尝试验证 vuetify v-text-field。我有两条规则，一条用于必填字段，另一条用于验证用户仅输入正数。但它不起作用，我收到此错误： [Vuetify] 规则应该 return 一个字符串或布尔值，而不是收到 'object'。这是我在 vue 文件中定义规则的方式：

rules: {
        select: [(v) => !!v || "Item is required"],
    
        emailRules: [
            v => !!v || 'E-mail is required',
            v => /.+@.+\..+/.test(v) || 'E-mail must be valid',
        ],
        phoneRules: [
            v => /(\+1)?\s?\(?\d{3}\)?-?\s?\d{3}-\d{4}/.test(v) || 'Phone Number must be valid',
            v => v.length <= 15 || 'Phone Number must be valid'
        ],
        numberRules: [
            v => /\d+\.?\d*/.test(v) || 'You have to enter a number',
            v => v>0 || 'You have to enter a positive number'
        ]
    },

这是观点：

<v-text-field
   v-if="loggedUser.role_id == 1"
   v-model="editedItem.commission"
   label="Commission (%) *"
   required
   :rules="[rules.select, rules.numberRules]"
></v-text-field>

如果我单独使用它们，它们工作正常，但如果我把它们都放在一起，它们都不起作用。

Answer 1

您应该使用扩展运算符连接规则以获得规则数组：

:rules="[...rules.select, ...rules.numberRules]"

规则应该 return 一个字符串或布尔值，当使用多个规则时收到 'object'

Rules should return a string or boolean, received 'object' instead when using more then one rule

validationrules

vue.js

vuetify.js