在React

Question

我真的很困扰这个问题，它看起来非常简单，但是我无法访问父对象的子对象，请有人协助。下图是控制台日志：

渲染时看不到结果

const listItems = this.state.list.map((item, index) => <p>{item.title}</p>);

当然，当我尝试this.state.list.map((item, index) => <p>{item}</p>);时，出现以下错误：

  

对象无效，不能作为React子对象

主要功能：

componentDidMount = () => {
    fire
        .database()
        .ref(`/feed/`)
        .on('value', snapshot => {
            var obj = snapshot.val();
            var list = [];
            for (let a in obj) {
                list.push(obj[a]);
            }
            console.log(list);
            this.setState({
                list: list,
                loading: false
            });
        });
};

可以在此处找到一个实时会话（Home.js） https://codesandbox.io/live/DR7WzY

编辑：我的最后一次尝试

        for (let a in obj) {
            for (let b in obj[a]) {
                console.log(b);
            }
        }

但是它是空的！

Answer 1

item.title之所以有效，是因为它是一个字符串。您不能传递对象，如果要查看对象，则可以将其字符串化：

this.state.list.map((item, index) => <p>{JSON.stringify(item)}</p>);

由于您嵌套了对象，因此需要执行以下操作：

this.state.list.map((item, index) =>
  Object.values(item).map(nestedItem => 
    <p>{JSON.stringify(nestedItem)}</p>));