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

【问题标题】：Axios - Display returned error from validation is [object Object]Axios - 显示验证返回的错误是 [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())

标签： javascript vue.js vuejs2 axios vue-component

【解决方案1】：

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

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

【讨论】：