next
next copied to clipboard
[Balloon]tree 组件 Balloon组件结合使用,出现重复选中
Component
Balloon
Steps to reproduce
tree 组件 Balloon组件结合使用,出现重复选中(一个选中,一个持续hover态)tree节点情况

复现方式
执行以下代码 从上到下点击菜单即可复现
复现代码
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 -->
应该是 balloon 消失时焦点自动回到了上一个聚焦的地方, @jerryyxu 看下吧
给 Balloon 设置 autoFocus={false} 即可解决