要实时监听Tabs组件的切换,您可以使用onChange属性来设置一个回调函数。在该回调函数中,您可以获取到当前选中的key值,然后进行相应的处理。
以下是一个示例代码:
import { Tabs } from 'antd';
function handleTabChange(key) {
console.log('当前选中的Tab:', key);
// 在这里可以执行其他逻辑操作
}
function YourComponent() {
return (
<Tabs defaultActiveKey="1" onChange={handleTabChange}>
{/* TabPane 的内容 */}
</Tabs>
);
}
在上述代码中,当用户切换不同的标签页时,handleTabChange函数将会被触发,并且会打印出当前选中的标签页的 key 值。您可以根据需要在该回调函数内执行其他逻辑操作。
内容由零声教学AI助手提供,问题来源于学员提问




