React JS：在控制台中记录数组项答案

【问题标题】：React JS : Logging the array items in the consoleReact JS：在控制台中记录数组项
【发布时间】：2023-03-31 19:18:01
【问题描述】：

我有一个对象数组，我需要在其中逐个查看对象内的每个项目及其在对象内的属性。当我尝试通过在代码中使用 console.log(listItems); 并在 Google Chrome 中进行检查来查看对象时，在控制台选项卡中我得到了；

listofItems: [object Object],[object Object],[object Object],[object Object] ...

但我需要的是查看 Items 内部的属性和属性，以及在包含多个对象的数组中分配给它们的相应值。我已经试过了

console.log(JSON.stringify(listItems));

但最终出现错误：

Uncaught TypeError: Converting circular structure to JSON --> 
   starting at object with constructor 'FiberNode' | property 'stateNode' -> ...

考虑下面的代码 sn-p：

render() {
        let { items } = this.props;
        let listItems = items.map( (item) => {
            return (
                    <TodoItem text={item.text} 
                       ID={item.key} 
                       isComplete={item.completedItem} 
                       onDelete={this.props.onDelete} 
                       onEdit={this.props.onEdit} 
                       handleComplete={this.props.handleComplete}/>
            );
        });
        console.log("listofItems: " + listItems);
....

有什么方法可以查看数组内每个对象中分配的属性和值...？

【问题讨论】：

考虑在您的帖子中附加一些代码（最好与您的源数据一起）。

标签： arrays reactjs object console console.log

【解决方案1】：

使用逗号代替 +。

console.log("listofItems: ",  listItems);

这种方式 javascript 不会尝试将其转换为字符串，并且 chrome 控制台可以让您扩展对象数组

【讨论】：