Can't call state?

Question

JavaScript

There is a state

constructor() {
        super();
        this.state = {
            data: {},
            trainer: [],
            diagram: this.chartData(),
        };
    }

Data has a numeric field boys and girls, I want to call them in the chartData function

chartData() {
        console.log(this.state.data.boys);
        return {
            labels: ['Boys', 'Girls'],
            datasets: [
                {
                    label: 'My First dataset',
                    fillColor: 'rgba(220,220,220,0.2)',
                    strokeColor: 'rgba(220,220,220,1)',
                    pointColor: 'rgba(220,220,220,1)',
                    pointStrokeColor: '#fff',
                    pointHighlightFill: '#fff',
                    pointHighlightStroke: 'rgba(220,220,220,1)',
                    data: [3, 0],
                },
            ]
        }
    }

But gives error TypeError: this.state is undefined. What am I doing wrong?

Answer 1

constructor() {
        super();
        this.state = {
            data: {},
            trainer: [],
            diagram: this.chartData(),
        };

this.chartData=this.chartData.bind(chartData)
    }

Answer 2

Or declare chartData as an arrow function
chartData = () => {