antd tabs标签页

antd Tabs 是一款常用的标签页组件，可以用于实现页面之间的切换。使用 antd Tabs 需要先安装 antd，并在需要使用的页面引入相应的组件。

首先，安装 antd:

npm install antd

然后，在需要使用的页面引入 Tabs 组件:

import { Tabs } from 'antd';
const { TabPane } = Tabs;

function MyTabs() {
  function callback(key) {
    console.log(key); // 当前选中的标签页的 key 值
  }

  return (
    <Tabs defaultActiveKey="1" onChange={callback}>
      <TabPane tab="Tab 1" key="1">
        Content of Tab Pane 1
      </TabPane>
      <TabPane tab="Tab 2" key="2">
        Content of Tab Pane 2
      </TabPane>
      <TabPane tab="Tab 3" key="3">
        Content of Tab Pane 3
      </TabPane>
    </Tabs>
  );
}

在上面的例子中，我们创建了一个 MyTabs 组件，包含了三个 TabPane，每个 TabPane 都有一个唯一的 key 值和对应的内容。通过设置 defaultActiveKey 属性，可以指定默认选中的标签页。当用户切换标签页时，会触发 onChange 回调函数，可以在该函数中处理相应的逻辑。

以上是一个简单的示例，你可以根据自己的需求来配置 Tabs 组件，并在 TabPane 中添加自己的内容。