我是 React 的新手,我有一个项目,在将 D3 安装到我的项目并创建此类后,我将使用它来创建我的图表:
import React, { Component } from 'react';
var ReactDOM = require('react-dom');
var LineChart = require('react-d3-basic').LineChart;
class TempChart extends Component{
constructor(){
super();
this.state={
generalChartData:{},
chartSeries:[],
x:0
}
}
componentWillMount(){
fetch("my JSON url was here")
.then(response=>response.json())
.then((findresponse)=>{
this.setState({
generalChartData:findresponse.feeds.map((feed, i) => parseFloat(feed.field1)),
chartSeries:[
{
field: 'age',
name: 'Age',
color: '#ff7f0e',
style: {
"stroke-width": 2,
"stroke-opacity": .2,
"fill-opacity": .2
}
}
],
x:function(d) {
return d.index;
}
})
})
}
render(){
return (
<LineChart
width= {600}
height= {300}
data= {this.state.generalChartData}
chartSeries= {this.state.chartSeries}
x= {this.state.x}
/>
);
}
}
export default TempChart;
我知道在 React 15.5 版之后,您必须从 prop-types 导入 PropTypes,如下所示:
import PropTypes from 'prop-types';
或者
var PropTypes = require('prop-types');
现在我的问题是我在哪里导入它,因为所有 D3 文件都使用导致问题的旧 PropType 并且 D3 库中有很多文件我无法在每个文件中导入新文件。
这是我的 package.json 文件:
{
"name": "d3app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.4.1",
"react-d3-basic": "^1.6.11",
"react-dom": "^16.4.1",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}