ReactJS/Javascript-无法为对象中的项呈现组件

我在为对象中的每个项实例渲染组件时遇到一些问题

虽然我能够记录每个项目的单独标题，但无论我尝试返回哪个组件，return函数都不会返回任何内容。显然没有错误

是否有更好的方法根据对象中的每个项返回组件

任何帮助都将不胜感激！：）

import React，{Component}来自'React'；
导出默认类包装扩展组件{
常量obj=（）=>({
“一”：{
“头衔”：“一个”，
“说明”：“foo”，
},
“二”：{
"标题":"两个",，
“说明”：“酒吧”，
},
});
renderSingleItem（实例）{
console.log（instance）；//这很好用！
return（//这不起作用？！
{instance.description}
);
}
渲染项目（数据）{
Object.entries（data.forEach）（[key，instance]）=>{
返回此.renderSingleItem（实例）；
});
}
render（）{
返回(
{this.renderAllItems（this.obj）}
);
}
}

---

此函数有两个问题

renderAllItems(data) {
        Object.entries(data).forEach(([key, instance]) => {
            return this.renderSingleItem(instance);
        });
    }

您需要在

对象之前添加另一个返回键。键

，您应该使用

.map

而不是

。forEach

，因为

forEach

无效，这意味着它不会返回任何内容

代码应该是这样的

renderAllItems(data) {
       return Object.entries(data).map(([key, instance]) => {
            return this.renderSingleItem(instance);
        });
    }

这对我来说非常有效：

从“React”导入React；
从'react dom'导入{render}；
导出默认类包装扩展React.Component{
建造师（道具）{
超级（道具）
this.obj={
“一”：{
“头衔”：“一个”，
“说明”：“foo”，
},
“二”：{
"标题":"两个",，
“说明”：“酒吧”，
},
};
}
renderSingleItem（实例，k）{
console.log（instance）；//这很好用！
返回（）；
}
/*
*没必要
渲染项目（数据）{
Object.entries（data.forEach）（[key，instance]）=>{
返回此.renderSingleItem（实例）；
});
}*/
render（）{
返回(
{Object.keys（this.obj）.map（（k）=>{
返回此.renderSingleItem（this.obj[k]，k）；
})}
);
}
}
//我把这个留给你
//render（，document.getElementById（'root'））

另外一个可能让你的生活更轻松的方法是使用

Object.keys

vs

Object.entries

？因为这只是给了我索引。它应该给你键看看这个链接