我正在尝试使少数字段有条件地需要。但我无法让它发挥作用。我设置了一个数据字段 notRequired: false
并基于此,我在字段中使用它作为 :required="!notRequired"
使这些字段成为不需要的,因为在某些情况下我需要这些字段,而在某些情况下我不需要,因为我试图有条件地设置它。问题是由于添加到字段中的规则,错误消息仍然出现。有没有办法让规则也有条件?
<template>
<v-text-field
label='Agency Name'
v-model='agency.name'
:rules='nameRules'
:required="!notRequired"
required>
</v-text-field>
<v-text-field
label='Agency Code'
:rules='codeRules'
:required="!notRequired"
v-model='agency.code'>
</v-text-field>
<v-text-field
label='Agency location'
:rules='locationRules'
:required="notRequired"
v-model='agency.location'>
</v-text-field>
</template>
<script>
export default {
data: function () {
return {
notRequired: false,
agency: {
name: '',
code: '',
location: '',
}
nameRules: [
value => !!value || 'Please enter name'
],
codeRules: [
value => !!value || 'Please enter code'
],
locationRules: [
value => !!value || 'Please enter location'
],
}
}
}
</script>
最佳答案
您可以使用 ternary运算符有条件地添加规则,具体取决于 notRequired
的值:
<v-text-field
label="Agency Name"
v-model="agency.name"
:rules="notRequired ? 'nameRules' : []" <!-- HERE -->
:required="!notRequired">
</v-text-field>
关于javascript - vue中如何设置条件规则和必填字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62178081/