当我点击我的图表时，我怎样才能做点什么？

Question

我想做一个 onClick 事件，当我点击一个栏时它会生成一个控制台日志，我该怎么做？

state = {
    chartData: {
      labels: [],
      datasets: [
        {
          label: 'Covid-19',
          data: [],
          backgroundColor:'red',
          borderColor: 'red',
          hoverBackgroundColor: 'green',
          hoverBorderColor: 'green',
          borderWidth: 4,
          responsive: true,
        }
      ],
    }
  }



<div className="container">
    <Bar  data={this.state.chartData}}/>
  </div>

Answer 1

请尝试如下代码段。

onClick = (e) => {
   var data = e.target.data;
   console.log(data);
}

...
state = {
    chartData: {
      labels: [],
      datasets: [
        {
          label: 'Covid-19',
          data: [],
          backgroundColor:'red',
          borderColor: 'red',
          hoverBackgroundColor: 'green',
          hoverBorderColor: 'green',
          borderWidth: 4,
          responsive: true,
        }
      ],
    }
  }



<div className="container">
    <Bar  onClick={(e)=>this.onClick()} data={this.state.chartData}}/>
  </div>