Sometimes I don't want to have a "rules" option/property in some input fields, is it possible within vuejs3 to set up a kind of if statement so that the property "rules" are only presented on certain fields? Because now i just do an empty array[]. But would rather see this differently. So that I dont need to apply "rules" option in my form scheme when I dont need it.

This is my template code:

 <div v-for="(prop, key) in formSchema" :key="key">
      
      <q-input v-if="prop.component === 'input'"
         outlined
         v-model="dataRef[key]"
         :type="prop.type"
         :label="prop.label"
         maxlength="12"
         
         hint="Name and surname"
         lazy-rules
         :rules="prop.rules" (want this behind an if statement if not needed)
       >
      </q-input>
    
      <q-select v-else-if="prop.component === 'select'"
        outlined
        v-model="dataRef[key]"
        :type="prop.type"
        :options="prop.options"
        :label="prop.label">
      </q-select>
    
    </div>

CodePudding user response：

Add a ternary condition within your attribute. When the attribute is set to null or undefined it gets omitted.

:rules="addRule ? prop.rules : null"