Warning: [antd: Tabs] Tabs.TabPane is deprecated. Please use `items` directly.

Warning: [antd: Tabs] Tabs.TabPane is deprecated. Please use items directly.

problem

控制台报错 Warning: [antd: Tabs] Tabs.TabPane is deprecated. Please use items directly.

reason

https://ant.design/components/tabs/
Usage upgrade after 4.23.0#

antd tabs组件 在 4.23.0 版本上做了更新

solution

// before 
<Tabs activeKey={type} onChange={setType}>
    <Tabs.TabPane key="account" tab={'账户密码登录'} />
    <Tabs.TabPane key="mobile" tab={'手机号登录'} />
</Tabs>

// after 
const items = [
    { label: '账户密码登录', key: 'account',  }, 
    { label: '手机号登录', key: 'mobile', },
];
<Tabs activeKey={type} onChange={setType} items={items}></Tabs>

这篇好文章是转载于：学新通技术网