Axios响应嵌套对象仅显示[Object]，如何完整查看其字段值对？

嘿，我来帮你搞定这个嵌套对象显示的问题～

首先，你看到的[Object]其实是浏览器或Node.js控制台默认对深层嵌套对象做的截断显示，并不是数据本身缺失了。下面给你几种能完整查看nestedObject的方法：

方法1：使用console.dir()展开完整结构 #

console.dir()专门用于显示对象的详细结构，搭配depth: null参数可以无限展开所有层级的嵌套内容：

axios.get(url + '?hapikey=' + copyFrom)
  .then(res => console.dir(res.data, { depth: null }));

方法2：转成格式化的JSON字符串打印 #

用JSON.stringify()把整个响应对象转成字符串，还能指定缩进让格式更易读：

axios.get(url + '?hapikey=' + copyFrom)
  .then(res => console.log(JSON.stringify(res.data, null, 2)));

这里第二个参数null表示不过滤任何属性，第三个参数2表示用2个空格缩进排版。

关于是否只能在.then中查询的问题 #

当然不是只能在.then里查看！你可以把响应数据存储到一个全局（或可访问范围内）的变量里，之后在控制台手动查看，或者在代码其他逻辑里使用：

// 定义一个可访问的变量
let fullResponseData;

axios.get(url + '?hapikey=' + copyFrom)
  .then(res => {
    fullResponseData = res.data;
    console.log("数据已存储，可在控制台输入fullResponseData查看");
  });

之后打开浏览器控制台，直接输入fullResponseData并回车，就能点击展开查看完整的嵌套对象结构了。

另外提个小技巧：现代浏览器的控制台里，即使你用普通的console.log()打印了带[Object]的内容，点击控制台里的[Object]也能展开查看完整的嵌套字段哦～

内容的提问来源于stack exchange，提问作者Vincent Nguyen