antd的Tooltip组件添加动画效果之后，延迟消失

需求

给“插入”按钮添加tooltip，并且当鼠标移动到“插入”按钮时，让tooltip消失

bug描述和源码

这个tooltip在添加了css上下移动的动画之后，鼠标滑出本来tooltip应该立刻消失的，但是它延迟了1s左右，才消失

代码展示：

 .introduce-insert {
     animation: move-down-up ease-in-out 1s infinite;
 }



  // 一上一下动画效果
  @keyframes move-down-up {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(6px);
    }
    100% {
      transform: translateY(0);
    }
  }

  const [hoverInsertMain, setHoverInsertMain] = useLocalStorageState('show-insertmain-instruction', {
    defaultValue: true,
  }) // 控制“插入”功能引导popover的显示和隐藏
  
  {/* 新增“插入”菜单项 */}
          <Popover
            // open={visibleMore}
            trigger="hover"
            overlayClassName="insert-main-popover"
            getPopupContainer={node => node}
            content={
              <MoreBtnStyle>
                <div
                  className="moreBtn"
                  onClick={event => {
                    // setVisibleMore(false)
                    event.stopPropagation()
                  }}
                >
                  {toolbar.mainInsertMenu.map((item, index) => {
                    return (
                      <Fragment key={index}>
                        正常的tooltip
                      </Fragment>
                    )
                  })}
                </div>
              </MoreBtnStyle>
            }
          >
            <Popover
              open={hoverInsertMain}
              getPopupContainer={node => node}
              overlayClassName="introduce-insert"
              zIndex={1}
              content={
                <div className="introduce-text">
                 这时添加了动画的tooltip
                </div>
              }
            >
              <div
                style={{ color: !isLook && isSelectNode ? '#323233' : '', cursor: 'pointer' }}
                onClick={event => {
                  event.stopPropagation()
                  setHoverInsertMain(false)
                }}
                onMouseEnter={() => {
                  setHoverInsertMain(false)
                }}
              >
                <SvgIcon
                  iconName="charu"
                  type="park"
                  className={`topIcon ${!isLook && isSelectNode ? 'active' : ''}`}
                ></SvgIcon>
                插入
              </div>
            </Popover>
          </Popover>

原因和解决方法

因为antd的Tooltip的消失本身是有一个动画的（在1s内逐渐变小），所以我添加的动画和官方的冲突了，就会继续上下移动的动画1s才消失。

改进如下：

在需要添加动画的Tooltip组件里面加上：

    overlayStyle={{ animation: hoverInsertMain ? 'move-down-up ease-in-out 1s infinite' : undefined }}

这样当需要Tooltip消失的时候，也就是hoverInsertMain是false时，我新添加的动画消失，tooltip继续执行它消失的动画。就不会有一个1s的延迟了