VueJS和laravel验证数组

Question

从Laravel到VueJS的验证。

我需要向正确的输入字段显示正确的错误消息。 有谁有想法？

form.vue：

<tr v-for="(item, index) in form.items">
 <td>
 <input type="text" v-model="item.name" class="form-control">
  <small class="text-danger" v-if="errors.name">
  {{errors.name[0]}}</small>
  </td>
   <input type="text" v-model="item.age" class="form-control">
  <small class="text-danger" v-if="errors.age">
  {{errors.age[0]}}</small>
  </td>
  </tr>

控制器：

$this->validate($request, [
        'items.*.name' => 'required',
        'items.*.age' => 'required',
    ]);

我在我的vue devtools中得到了这个

Answer 1

看起来你必须通过你的错误对象进行迭代。在错误中，您的密钥是＆＃34; items.0.name＆＃34;，因此您可能必须使用{{errors [＆＃39; items.0.name＆＃39;]}}。但我认为你必须改变你的laravel错误验证。

Answer 2

我使用甜蜜警报显示我的错误消息。我先在我的axios帖子上抓到它。

     createAdminstrator(name, username, password, confirmpassword, superadmin) {
        const t = this;

        axios.post('/administrators', {name: name, username: username, password: password, confirmpassword: confirmpassword, superadmin: superadmin})
            .then(({data}) => {
                t.administrators.unshift(data);
                t.error = '';
            })
            .catch(error => {
                if (error.response.data.errors.username) {
                  swal(error.response.data.errors.username[0], "Error", "error");
                } else if (error.response.data.errors.confirmpassword) {
                  swal(error.response.data.errors.confirmpassword[0], "Error", "error");
                } else if (error.response.data.errors.password) {
                  swal(error.response.data.errors.password[0], "Error", "error");
                }
              });
    }