设置 react-chartjs 时出现此错误,我使用的是here 示例。 这是我得到的错误:
Uncaught (in promise) TypeError: Cannot read property 'xLabels' of undefined
at updatePoints (core.js:127)
at Object.classData.componentWillReceiveProps (core.js:48)
...... so on
在this post他们说他们已经修好了,但他们没有想到。
这是我的代码:
var Chart = require('chart.js');
var LineChart = require("react-chartjs").Line;
export default class Dashboard extends Component {
constructor(props){
super(props);
var result = '';
this.state = {
chartData: '',
chartOptions: ''
};
}
componentDidMount(){
var chartData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
}
var chartOptions = {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
this.setState({
chartData: chartData,
chartOptions: chartOptions
})
}
render () {
return (
<div className="container">
<div className="chart-wrapper">
<LineChart data={this.state.chartData} width="600" height="250"/>
</div>
</div>
)
}
}
可能是什么问题?我是新来的反应和坚持图表。任何帮助,将不胜感激。
答案 0 :(得分:3)
&#34;的重绘强>&#34;应该有所帮助:
<LineChart data={this.state.chartData} width="600" height="250" redraw/>