如何访问 Vue.js 中的 laravel 验证错误？

Question

我正在使用 laravel 9 和 Vue 3。我正在尝试访问 vue 中的 laravel 验证错误。 laravel.

发送的错误消息

{message: "The given data was invalid.",…}
errors: {supplyData.supplier_id: ["Please fill the supplier field"]}
supplyData.supplier_id: ["Please fill the supplier field"]
0: "Please fill the supplier field"
message: "The given data was invalid."

我已尝试使用以下代码来访问错误，但没有成功。

  <span
                    v-if="errors['supplyData.supplier_id']"
                   
                    class="invalid_feedback"
                    style="display:block; color:red;"
                    role="alert"
                >
                   {{ errors["supplyData.supplier_id"][0]}}
   </span>

Answer 1

如果您检查控制台以查看来自 laravel 后端的真正响应，您可能会看到它在数据对象内部，

假设您有像 store() 这样的 axios 调用..

在这个商店请求之后你得到的数据是响应。错误在此响应的内部数据中。

您可能可以像这样到达它：response.data.errors

        .catch(error => {
            this.errors = error.response.data.errors; // this should be errors.
             console.log(this.errors);
        });

如何访问 Vue.js 中的 laravel 验证错误？

How to access laravel validation error in Vue.js?

validation

laravel

vue.js