Vue 中需要验证

Question

我在我的 VueJS 中使用 vee-validate，我想知道如何添加验证，如果 form.order == 1 则需要

 <ValidationProvider rules="v-if="form.order == 1 ? required: ''" v-slot="{ errors }" name="Entity">
   <v-col md="4">
      <v-text-field
         label="First Name"
         v-model="form.first_name"
         outlined
         hide-details="auto"
         :error-messages="errors[0]"
         ></v-text-field>
   </v-col>
</ValidationProvider>

Answer 1

试试这个。

:rules="form.order == 1 ? 'required' : ''"

Answer 2

我可以建议您将@Phymo 的答案移动到计算的属性中，这样您就可以保持模板干净、可读和可扩展。这样，您可以随时交换实现。即

<template>
  <ValidationProvider :rules="applyRules" v-slot="{ errors }" name="Entity">
     <v-col md="4">
        <v-text-field
           label="First Name"
           v-model="form.first_name"
           outlined
           hide-details="auto"
           :error-messages="errors[0]"
           ></v-text-field>
     </v-col>
  </ValidationProvider>
 </template>

<script>
export default {
  data: () => ({
    form: {
      // form structure
    }
  }),
  computed: {
    applyRules() {
      return this.form.order === 1 ? 'required' : ''
    }
  }
 }
</script>

Vue 中需要验证

Validation Required in Vue

vue.js

vee-validate