useState获取不到值undefined，数据一直为初始值不更新，用useRef解决

问题描述：
在进行单元格文本样式设置操作时，我使用了Jexcel提供的方法onselection，此方法可以获取到点击的单元格的名称(如：A1)
然后我想使用useState保存点击的单元格名称再进行改版字体样式，但是在要加粗字体的点击事件的地方，获取到的state一直undefined，就没办法进行修改字体样式
可能的原因是useState修改状态是异步的，当使用usestate对数据进行更新，并不能立刻获取到最新的数据。如果异步未执行完成时修改这个state的值，异步结束后获取的值仍然为原来的值
我一开始是使用useState，没有给初始值

const [choose,setchoose]=useState()

事件顺序是

由于异步未执行完成，所以一直获取到的就是undefined即初始值

所以这里需要用useRef来保存每次点击单元格的名称。

修改后完整代码：

import React, { useEffect, useRef, useState } from "react";
import "../../node_modules/jexcel/dist/jexcel.css";
import jexcel from 'jexcel'
import { Space } from "antd";
import 'material-design-icons/iconfont/material-icons.css';//引入导航上用到的图标
import { toJS } from "mobx";
let el:any;
const FirstJexcel = () => {
    let JexcelDom: HTMLDivElement;
    const choose=useRef() //保存选中的单元格
    let selectionActive = function(instance: any, x1: any, y1: any, x2: any, y2: any, origin: any) {
        var cellName1 = jexcel.getColumnNameFromId([x1, y1]);
        choose.current = cellName1 //保存单元格名称
    }
    const changestyle=()=>{
        console.log('choose',choose.current);   
      el.setStyle(choose.current,'font-weight', 'bold')
    }
    let option: any = {
        data: [[]],
        minDimensions: [10, 5],
        onselection: selectionActive,
        toolbar:[
        {
            type:"i",
            content:"format_bold",//图标
            onclick:changestyle  //点击事件
        }],
       
    }

    useEffect(() => {
        el = jexcel(JexcelDom, option)
    },[])

    return (
        <div>
            <div ref={(dom: HTMLDivElement) => JexcelDom = dom} />
            <br />
        </div>
    );
};
export default FirstJexcel;