Reactjs React js:Nivo饼图未显示

我使用的是react js和nivo饼图，我使用的是服务器中提供的确切代码，但是当我启动服务器时，图表不会呈现，它显示空页面，并且控制台和服务器终端中没有错误

代码：

从“React”导入React；
从'react dom'导入{render}
从'@nivo/pie'导入{ResponsivePie}
风险值数据=[
{
“id”：“锈迹”，
“标签”：“锈迹”，
“价值”：576，
“颜色”：“hsl（167、70%、50%）”
},
{
“id”：“javascript”，
“标签”：“javascript”，
“价值”：129，
“颜色”：“hsl（119,70%，50%）”
},
{
“id”：“java”，
“标签”：“java”，
“价值”：422，
“颜色”：“hsl（253，70%，50%）”
},
{
“id”：“黑客”，
“标签”：“黑客”，
“价值”：71，
“颜色”：“hsl（307，70%，50%）”
},
{
“id”：“erlang”，
“标签”：“erlang”，
“价值”：354，
“颜色”：“hsl（187，70%，50%）”
}
];
渲染((
)，document.getElementById（'root'）；

这是我第一次在react js中处理图表。 无论我做错了什么，我们都会感激你的帮助。

---

谢谢。

我想您可能忘了设置ResponsivePie的父组件的高度。以下是文档中的解释

---

使用响应组件时，请确保父容器具有定义的高度，否则高度将为0，并且不会呈现任何图表 像这样：

<div style={{height: 200}}>
   <ResponsivePie .../>
</div>

---

谢谢你的帮助。我忘了

<div style={{height: 200}}>
   <ResponsivePie .../>
</div>