在ReactJS中呈现JSON键值对？

Question

我从JS跳到React。我已经搜索了一些与此相关的其他线程，但它们似乎太具体，或回答了一个不同的问题。

我有一个使用python脚本生成的本地JSON文件。它看起来像下面这样：
[{"hello": 10, "world": 15}]

我怎样才能从对象 JSON TEXT 中获取键和值并通过react组件呈现它？

我将文件存储在变量中，例如：
'var jsonData = require('./data.json');

当然我可以通过控制台用日志调用数据，但如果我尝试通过我的渲染功能显示它，如： <div>{jsonData}</div>

我收到错误，指出“对象无效作为React子（...）”。

导入和显示我的JSON文件中保存的键值对的正确方法是什么？

Answer 1

要将JSON转换为字符串，为了显示，您可以使用JSON.stringify方法：

<div>{JSON.stringify(jsonData)}</div>

当然，您可能希望使用HTML / CSS正确格式化数据。