Question

大家如何将Vuelidate与v-for一起使用。我似乎无法使其正常工作。它要么验证我表单中的每个text-fields，要么抛出错误。我只希望它验证输入的字段，而不验证从v-for创建的其他字段。

在下面的模板中，您可以看到creds中的amazonCredsArray是从父组件传入的道具。根据{{1}}中的哈希数，创建的表单数。使用下面的设置，下面的amazonCredsArray被多次创建，当仅输入1时，Vuelidate会验证所有这些字段。我在该字段上定义了text-field，但无济于事。

模板

:key

还有我的冒犯脚本：

脚本

<template>
<v-container fluid grid-list-lg class="come_closer">
  <v-layout row wrap>
    <v-flex xs12 v-for="creds in amazonCredsArray" :key="creds.id" class="pb-4">
      <v-card class="lightpurple">
        <v-card-title>
          <v-icon class="my_dark_purple_text">language</v-icon>
          <h1 class="title oswald my_dark_purple_text pl-2 pr-5">ENTER YOUR AMAZON CREDENTIALS BELOW</h1>
        </v-card-title>

     <v-form>
        <v-layout xs12 row wrap class="mx-auto" >
          <v-flex xs12>
            <v-text-field
              :error-messages="sellerIdErrors"
              required
              :key="creds.seller_id"
              color="indigo"
              label="Amazon Seller Id"
              v-model="creds.seller_id"
              prepend-icon="person"
              @input="$v.seller_id.$touch()"
              @blur="$v.seller_id.$touch()"
            ></v-text-field>
          </v-flex>

将Vuelidate与v-for和props一起使用

0 个答案: