ant design tree 切换在点开,展开三角图标消失问题解决

在这里插入图片描述

前提:

当左侧切换重新加载数据的时候,tree已展开的字段 三角图标会消息
代码如下:

          <Tree
            showIcon
            onSelect={onSelectTree}
            loadData={onLoadData}
            treeData={treeData}
          />

解决如下

添加key,每次数据加载回来,刷新key即可刷新tree

  // tree标识key
  const [uuid, setUuid] = useState<string>(createUUID());
  // 获取列表
  const getCatalog = async (id: string) => {
    const { msg, status, desc } = await getList({ id });
    setUuid(createUUID());//每次获取列表刷新key
    if (status < 20000) {
.......
    } else {
      message.warning(desc);
    }
  };
          <Tree
            key={uuid}
            showIcon
            onSelect={onSelectTree}
            loadData={onLoadData}
            treeData={treeData}
          />

UUID创建如下:

// 生成唯一id
export const createUUID = () => {
  let d = new Date().getTime();
  const uuid = 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, (c: any) => {
    const r = (d + Math.random() * 16) % 16 | 0;
    d = Math.floor(d / 16);
    return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);
  });
  return uuid;
};
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值