首页 > 解决方案 > React JS:在控制台中记录数组项

问题描述

我有一个对象数组,我需要在其中逐个查看对象内的每个项目及其在对象内的属性。当我尝试使用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' -> ...

考虑下面的代码片段:

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);
....

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

标签: arraysreactjsobjectconsoleconsole.log

解决方案


Use comma instead of +.

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

This way javascript wont try to convert it to string, and chrome console would let you expand your array of objects


推荐阅读