Chartjs-Cannot read properties of undefined with react-chartjs-2 and chart js problem

by

0👍

✅

in Main component:

import { UserData } from './UserData.js';
import React from 'react'

const [data, setData] = React.useState({
        labels: UserData?.map((data) => data.year),
        datasets: [
            {
                label: 'Users Gained',
                data: UserData?.map((data) => data.userGain),
            },
        ],
    })
<Chart chartData={data} />

0👍

The problem may be related to the way you import/read the UserData. Assuming the data is defined in UserData.js, you could import it as follows:

import { UserData } from './UserData.js';

Please take a look at this StackBlitz and see how it could work with your code.

Leave a comment