VueJS 和 laravel 验证数组

Posted 2023-02-22

【中文标题】VueJS 和 laravel 验证数组

【英文标题】：VueJS and laravel validation array

【发布时间】：2017-09-25 00:49:58

【问题描述】：

从 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 开发工具中得到了这个

【问题讨论】：

有什么问题？

没有出现错误

似乎错误是数组而不是名称。 errors[0] 从输出的错误转储开始并分析实际结构或阅读官方文档？

【参考方案1】：

看起来您必须遍历您的错误对象。在错误中，您的键是“items.0.name”，因此您可能必须使用 errors['items.0.name'] 。但我认为你必须改变你的 laravel 错误验证。

【参考方案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");
                
              );