首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >反应图集成错误。无法读取未定义的属性“xLabels”

反应图集成错误。无法读取未定义的属性“xLabels”
EN

Stack Overflow用户
提问于 2017-11-20 15:56:12
回答 1查看 739关注 0票数 1

在设置react-chartjs,时,我会得到这个错误,我正在使用给定这里的示例。这是我正在犯的错误:

代码语言:javascript
复制
Uncaught (in promise) TypeError: Cannot read property 'xLabels' of undefined
    at updatePoints (core.js:127)
    at Object.classData.componentWillReceiveProps (core.js:48)
    ...... so on

这个职位,他们说他们已经修好了,但我不这么认为。

这里是我的代码:

代码语言:javascript
复制
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>
    )
  }
}

有什么问题吗?我是新的反应和坚持图表。任何帮助都将不胜感激。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-02-22 14:42:22

重绘”应该会有所帮助:

代码语言:javascript
复制
 <LineChart data={this.state.chartData} width="600" height="250" redraw/>
票数 6
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/47396039

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档