ant-design tree鼠标移入事件后，做了某些操作，但是树节点未及时更新

Question

我在树节点上加了鼠标移入事件，事件里主要是给currentTreeIdRef.current(我定义的变量)赋值。
然后树节点上有个span,通过currentTreeIdRef.current == element.id ?'showMenu': '';来动态添加className;但是实际情况是className为showMenu从未出现。请问是什么原因呢？
以下是代码
页面tree节点 <div className="tree-node" onMouseEnter={() => {treeOnMouseEnter(element)}} onMouseLeave={() => {treeOnMouseLeave(element)}}>{element.nodeName}
<span className={["operate-box", currentTreeIdRef.current == element.id ? 'showMenu': ''].join(' ')}><img src={menuPng} alt="" /></span></div>
方法:
// 树鼠标移入事件

const treeOnMouseEnter = (NodeMouseEventParams) => {
    currentTreeIdRef.current = NodeMouseEventParams.id;
}

// 树鼠标移出事件
const treeOnMouseLeave = (NodeMouseEventParams) => {
    currentTreeIdRef.current = 0;
}