Axios - 显示验证返回的错误是 [object Object]

Posted

技术标签:

【中文标题】Axios - 显示验证返回的错误是 [object Object]【英文标题】:Axios - Display returned error from validation is [object Object] 【发布时间】:2020-03-07 09:11:45 【问题描述】:

在我的 api 我有:

$request->validate([
        'firstname' => 'required',
        'lastname' => 'required',
        'username' => 'required|unique:users',
        'email' => 'required|email|unique:users',
        'password' => 'required'
    ]);

然后我在axios with 上发现了错误:

.catch(error=>
    console.log("Error: " + error.response.data.errors)
)

不过它会给我:Error: [object Object]

如果我故意输入一个已经在数据库中的username,然后将catch改为

.catch(error=>
    console.log("Error: " + error.response.data.errors.username)
)

它会显示Username is already taken,这是一件好事。

这意味着我必须手动指定error.response.data.errors.<x error> 才能显示消息,因为如果我输入data.errors.username 然后电子邮件是验证中的问题,控制台会显示Error: undefined,这是有道理的,因为没有data.errors.username,而是data.errors.email

有没有一种方法可以在不手动指定的情况下访问和显示返回的错误?非常感谢!

【问题讨论】:

你试过JSON.stringify(error.response.data.errors)吗? 是的。它将显示"username":["The username has already been taken."] 如果这样可以,我可以将其发布为答案吗? 我其实是想收下data.errors内的消息 试试console.log(Object.values(error.response.data.errors).flat().join()) 【参考方案1】:

为了显示错误对象值,尝试使用返回一些数组的Object.values(errors) 获取它们,然后使用flat() 方法从它们中创建一个数组,最后使用join() 方法连接这些值,如下所示:

  console.log(Object.values(error.response.data.errors).flat().join())

【讨论】:

以上是关于Axios - 显示验证返回的错误是 [object Object]的主要内容,如果未能解决你的问题,请参考以下文章

在结果消息猫鼬节点验证中显示实际错误

如何使用 vuejs 在 laravel 刀片中显示验证错误

Axios/Vue - 防止 axios.all() 继续执行

使用 axios vuejs 和 laravel 验证表单

Vuex Action - 返回 Axios 返回错误

console.log 中出现 Axios Stop 404 错误