Javascript 如何在react js中映射JSON数据？

我想以键值方式映射JSON数据。我在stackblitz上试过，但它显示出错误

我写的代码是：

import React from "react";
import ReactDOM from "react-dom";

const sampleJSON = {
  name: "Pluralsight",
  number: 1,
  address: "India",
  website: "https://www.pluralsight.com/"
};

function App() {
  return (
    <div>
      {Object.keys(sampleJSON).map((key, i) => (
        <p key={i}>
          <span>Key Name: {key}</span>
          <span>Value: {sampleJSON[key]}</span>
        </p>
      ))}
    </div>
  );
}

ReactDOM.render(<App />, document.getElementById("app"));

从“React”导入React；
从“react dom”导入react dom；
常量sampleJSON={
名称：“Pluralsight”，
编号：1，
地址：“印度”，
网站：“https://www.pluralsight.com/"
};
函数App（）{
返回(
{Object.keys（sampleJSON）.map（（key，i）=>(

密钥名称：{Key}
值：{sampleJSON[key]}

))}
);
}
render（
您必须导出默认的react组件。通过更改此行，我在沙盒（）中实现了它

ReactDOM.render(<App />, document.getElementById("app"));

你需要导出你的
app组件
，而不是将其呈现给元素id app。问题是它试图找到元素id
app
，但在DOM中找不到。但是
index.js
做同样的事情，所以你不必做
ReactDOM.render
的事情

ReactDOM.render(

从“React”导入React；
常量sampleJSON={
名称：“Pluralsight”，
编号：1，
地址：“印度”，
网站：“https://www.pluralsight.com/"
};
导出默认函数App（）{
返回(
{Object.keys（sampleJSON）.map（（key，i）=>(

密钥名称：{Key}
值：{sampleJSON[key]}

))}
);
}
“我在stackblitz上试过了”，你应该与我们分享stackblitz本身。事实上，你映射的对象很好。是react组件给了你问题。检查你是否有ID为“app”的元素，因为默认CRA div有ID“root”/检查MYSTRING是否实际上是一个对象或字符串。如果它是字符串，则删除stringify并使用parse only。您也可以将MYSTRING放入您的问题中，您从后端获得了什么？
export default App;

import React from "react";

const sampleJSON = {
  name: "Pluralsight",
  number: 1,
  address: "India",
  website: "https://www.pluralsight.com/"
};

export default function App() {
  return (
    <div>
      {Object.keys(sampleJSON).map((key, i) => (
        <p key={i}>
          <span>Key Name: {key}</span>
          <span>Value: {sampleJSON[key]}</span>
        </p>
      ))}
    </div>
  );
}