我正在使用recharts库来渲染反应图中的图表。这是我的代码-
import React from 'react';
import {LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend} from 'recharts';
export default class AnalyticsHomePage extends React.Component {
constructor(props) {
super(props);
this.state = {
data : [
{name: 'Page A', uv: 4000, pv: 2400, amt: 2400},
{name: 'Page B', uv: 3000, pv: 1398, amt: 2210},
{name: 'Page C', uv: 2000, pv: 9800, amt: 2290},
{name: 'Page D', uv: 2780, pv: 3908, amt: 2000},
{name: 'Page E', uv: 1890, pv: 4800, amt: 2181},
{name: 'Page F', uv: 2390, pv: 3800, amt: 2500},
{name: 'Page G', uv: 3490, pv: 4300, amt: 2100},
]
}
}
render() {
return (
<div>
<LineChart width={600} height={300} data={this.state.data}>
<Line type="monotone" dataKey="uv" stroke="#8884d8" />
<CartesianGrid stroke="#ccc" />
<XAxis dataKey="name" />
<YAxis />
</LineChart>
</div>
);
}
}
我已经安装了npm recharts
软件包。我收到以下错误-
未捕获的ReferenceError:require未定义 在Object.events(外部“事件”:1) 位于 webpack_require (引导程序:22) 在Object ../ node_modules / recharts / es6 / util / Events.js(Events.js:1) 位于 webpack_require (引导程序:22) 在Object ../ node_modules / recharts / es6 / chart / generateCategoricalChart.js (generateCategoricalChart.js:1) 位于 webpack_require (引导程序:22) 在Object ../ node_modules / recharts / es6 / chart / LineChart.js(LineChart.js:1) 位于 webpack_require (引导程序:22) 在Object ../ node_modules / recharts / es6 / index.js(index.js:1) 在 webpack_require (引导程序:22)
感谢您的帮助。