react-chartjs-2 chartref update doesn’t work

This is my script of React component,

It dosen’t show the label, however dataset is correct,

So I guess this is the problem of update?

I really appreciate any hint,

import React,{useRef,useState,useEffect} from 'react'
import axios from 'axios';
import styles from "../css/test-styles.module.css";
import { Line } from 'react-chartjs-2';


import {
    Chart as ChartJS,
    CategoryScale,
    LinearScale,
    PointElement,
    LineElement,
    Title,
    Tooltip,
    Legend,
  } from 'chart.js'

ChartJS.register(
CategoryScale,
LinearScale,
PointElement,
LineElement,
Title,
Tooltip,
Legend
)


const DashboardPage = (props) =>{

    const data = useRef();
    const chartRef = useRef();
    const [labels,setLabels] = useState([]);
    const options = {
        responsive: true,
        plugins: {
          legend: {
            position: 'top'
          },
          title: {
            display: true,
            text: 'Chart.js Line Chart',
          },
        },
      };

    useEffect(()=>{
     

        data.current = {
            //labels:["june","july","august"],
            labels:labels,
            datasets: [
                {
                label: 'Dataset 1',
                data: [100,200,300],
                borderColor: 'rgb(255, 99, 132)',
                backgroundColor: 'rgba(255, 99, 132, 0.5)',
                },
                {
                label: 'Dataset 2',
                data: [350,150,250,100,200],
                borderColor: 'rgb(53, 162, 235)',
                backgroundColor: 'rgba(53, 162, 235, 0.5)',
                },
            ],
        };
        console.log("data",data.current); //data is correctly set
        console.log("chartref",chartRef);

        chartRef.current?.update();// it not work??
    },[labels])

    useEffect(()=>{
        const now = new Date();
        const OLDEST_DATE = new Date(2025, 0, 3)
        const resultDates = [];
        for (let date = OLDEST_DATE; date <= now; date.setDate(date.getDate() + 1)) {
            resultDates.push(new Date(date));
        }
        console.log(resultDates);
        var arr = resultDates.map((d)=>{
            return d.getMonth().toString() + "/" + d.getDate().toString();
        })
        console.log(arr);
        setLabels(arr);
    },[])
    return (
        <div className={styles.wrapper} style={{padding:"10px"}}>
            {data.current && 
            <Line ref={chartRef} options={options} data={data.current}/>}

        </div>

    );    
}

export default DashboardPage;