1

Vee-validate からのエラー メッセージを API からのエラー メッセージに設定しようとしています。

<div class="col-md-12">
  <label for="company-contact-name" class="label-input">Company Contact Name</label>
  <input v-validate="validations.user.name" v-model="data.user.name" id="company-contact-name" class="form-control" type="text" name="name" placeholder="Enter contact name" />
  <div id="name-error" class="msg-error text-danger">{{ errors.first('name') }}</div>
</div>


<div class="col-md-12">
  <label for="email" class="label-input">E-mail address</label>
  <input v-validate="validations.user.email" v-model="data.user.email" id="email" class="form-control" type="email" name="email" placeholder="Enter e-mail" />
  <div id="email-error" class="msg-error text-danger">{{ errors.first('email') }}</div>
</div>

そこで、APIがメールエラーを返す場合、上記の「errors.first('email')」をAPIエラーに編集したいと思います。次に、ユーザーがフィールドの修正を開始すると、Vee Validate は構成されたエラーを表示します。

これは、考えられるエラーの配列の例です。

[
  {id: "name", title: "Name is invalid. It should have only letters"},
  {id: "name", title: "Name is too short. It should have more than three characters"},
  {id: "email", title: "Email has already been taken"}
]

API エラー メッセージを処理するにはどうすればよいですか?

お時間とご関心をお寄せいただきありがとうございます。

4

1 に答える 1