alibaba-fusion / next

🦍 A configurable component library for web built on React.
https://fusion.design
MIT License
4.59k stars 590 forks source link

[Balloon]tree 组件 Balloon组件结合使用,出现重复选中 #2755

Open Mr-ZhaoRui opened 3 years ago

Mr-ZhaoRui commented 3 years ago

Component

Balloon

Steps to reproduce

tree 组件 Balloon组件结合使用,出现重复选中(一个选中,一个持续hover态)tree节点情况

image

复现方式

执行以下代码 从上到下点击菜单即可复现

复现代码


import { Tree, Balloon } from '@alifd/next';

const data = [
  {
    label: 'Component',
    key: '1',
    children: [
      {
        label: <div><Balloon
          trigger={
            <span>
              <span>Form</span>
            </span>
          }
          align="rt"
          closable={false}
          triggerType="hover"
        >
          <span>Form</span>
        </Balloon></div>,
        key: '2',

      }, {
        label: <div><Balloon
          trigger={
            <span>
              <span>Form</span>
            </span>
          }
          align="rt"
          closable={false}
          triggerType="hover"
        >
          <span>Form</span>
        </Balloon></div>,
        key: '4',
      },
      {
        label: <div><Balloon
          trigger={
            <span>
              <span>Form</span>
            </span>
          }
          align="rt"
          closable={false}
          triggerType="hover"
        >
          <span>Form</span>
        </Balloon></div>,
        key: '5',
      },
      {
        label: <div><Balloon
          trigger={
            <span>
              <span>Form</span>
            </span>
          }
          align="rt"
          closable={false}
          triggerType="hover"
        >
          <span>Form</span>
        </Balloon></div>,
        key: '3',

      }, {
        label: 'Table',
        key: '6',
      },
    ],
  },
];

ReactDOM.render(<Tree defaultExpandAll dataSource={data} />, mountNode);

<!-- generated by alibaba-fusion-issue-helper. DO NOT REMOVE -->
<!-- component: Balloon -->
youluna commented 3 years ago

应该是 balloon 消失时焦点自动回到了上一个聚焦的地方, @jerryyxu 看下吧

YSMJ1994 commented 8 months ago

给 Balloon 设置 autoFocus={false} 即可解决