json - 如何在 React 中使用 JSON 对象

Question

所以设置如下:

我有简单的nodejs后端(基于express和mongoose)，它用一些JSON(以对象的对象的形式)响应GET请求。

因此，在收到响应后，我想为所述对象的每个元素渲染一个组件。如果它是数组，我可以简单地使用 array.map()，并在回调函数中渲染一个组件。但由于我拥有的是对象，所以我不能使用它。

那么...我应该从后端返回数组吗？如果是这样，我如何告诉 mongoose 以数组的形式返回 model.find() 的结果。

或者我应该在前端将对象转换为数组吗？在这种情况下，我该如何在不经历某种循环的情况下做到这一点？

最后，我尝试让它像这样工作:

render: function() {
    //console.log('render TodoList componenr');
    var items = this.state.todoItems;
    return(
        <ul>
            {for (var item in items){
                console.log(item);
            }}
        </ul>
        ); 
}

我收到此错误:

Uncaught SyntaxError: embedded: Unexpected token (30:9)
  28 |                  return(
  29 |                      <ul>
> 30 |                              {for (var item in items){
     |          ^
  31 |                                  
  32 |                              }}
  33 |                      </ul>

这非常奇怪，因为它指向空位置？

有什么想法可以让这项工作成功吗？

Answer 1

要迭代对象，您可以使用 Object.keys，如下所示:

Object.keys(yourObject).map(function(key) {
    return renderItem(yourObject[key]);
});

该方法返回给定对象自己的可枚举属性的数组，其顺序与 for...in 循环提供的顺序相同(区别在于 for-in 循环也枚举原型(prototype)链中的属性) .

IE >= 9、Chrome >= 5、Safari >= 5、Firefox >= 4 支持。