uni-app HBuilderX console.log 调试json对象的问题

开发环境	版本号	项目创建方式
HbuilderX	3.4.7	-

操作步骤：

item是个json对象
console.log(item);


### 预期结果：

输出json对象就行了，每次都要用JSON.stringify转换

实际结果：

{ “ob”: { “dep”: { “id”: 13438, “subs”: { “0”: { “active”: true, “before”: “function before() {\n if (vm._isMounted && !vm._isDestroyed) {\n callHook(vm, ‘beforeUpdate’);\n }\n }”, “cb”: “function noop(a, b, c) {}”, “deep”: false, “depIds”: “Object”, “deps”: “Object”, “dirty”: false, “expression”: “function () {\n vm._update(vm._render(), hydrating);\n }”, “getter”: “function () {\n vm._update(vm._render(), hydrating);\n }”, “id”: 2125, “lazy”: false, “newDepIds”: “Object”, “newDeps”: “Object”, “sync”: false, “user”: false, “vm”: “Object” }, “length”: 1 } }, “value”: { “ob”: { “dep”: { “id”: 13438, “subs”: “Object” }, “value”: { “ob”: “Object” }, “vmCount”: 0 }, “vmCount”: 0 } }


### bug描述：

console.log 调试json对象的问题  

以前这个可以直接打印出来，现在打印出来是下面这种了，每次都需要  
item是个json对象  
console.log(JSON.stringify(item));  
在APP端是直接打印的，在H5需要转换一下。

sinazl 1楼•22 天前

内置浏览器是吧，我这里使用3.4.12没有复现这个问题。从3.4.7到3.4.12之间没有改动过内置浏览器插件。你再仔细核实下

songsunli 2楼•22 天前

在 uni-app 中使用 HBuilderX 进行开发时，console.log 是常用的调试工具。然而，当你在 console.log 中输出一个 JSON 对象时，可能会遇到一些问题，比如对象显示为 [object Object]，或者无法展开查看对象的详细内容。

以下是一些常见的问题和解决方法：

1. 直接输出 JSON 对象

如果你直接使用 console.log 输出一个 JSON 对象，可能会看到 [object Object]，这通常是因为 console.log 默认将对象转换为字符串。

let obj = { name: "John", age: 30 };
console.log(obj); // 输出: [object Object]

解决方法：使用 JSON.stringify 将对象转换为字符串后再输出。

let obj = { name: "John", age: 30 };
console.log(JSON.stringify(obj, null, 2)); // 输出格式化的 JSON 字符串

2. 输出嵌套对象

如果你有一个嵌套的 JSON 对象，直接输出可能会导致难以阅读。

let obj = { 
  name: "John", 
  age: 30, 
  address: { 
    city: "New York", 
    zip: "10001" 
  } 
};
console.log(obj);

解决方法：同样使用 JSON.stringify 来格式化输出。

let obj = { 
  name: "John", 
  age: 30, 
  address: { 
    city: "New York", 
    zip: "10001" 
  } 
};
console.log(JSON.stringify(obj, null, 2));

3. 在 HBuilderX 中查看对象

在 HBuilderX 的控制台中，console.log 输出的对象通常是可以展开查看的。如果你发现无法展开，可能是因为对象太大或嵌套太深。

解决方法：尝试使用 console.dir 来输出对象，它通常更适合查看复杂对象的结构。

let obj = { 
  name: "John", 
  age: 30, 
  address: { 
    city: "New York", 
    zip: "10001" 
  } 
};
console.dir(obj);

4. 使用 `console.table` 输出数组对象

如果你有一个数组对象，可以使用 console.table 来以表格形式输出，这样更易于查看。

let users = [
  { name: "John", age: 30 },
  { name: "Jane", age: 25 }
];
console.table(users);