import {Tabs} from 'antd';
class OperateComponent extends Component{
render(){
//设置destroyInactiveTabPane,不然会渲染多次(小于TabPane的长度)
<div className="company_model">
<div className="card-container">
<Tabs
type="card"
activeKey={this.state.activeKey}
destroyInactiveTabPane
onChange={(activeKey)=>this.modelTabChange(activeKey)}>
<TabPane tab='公司信息' key='company'>
{
!customerItem.company
?
<CompanyEmpty />
:
<CompanyInfo companyInfo={companyInfo}/>
}
</TabPane>
<TabPane tab='流量' key='traffic'>
<CompanyEmpty />
</TabPane>
<TabPane tab='摄像头' key='camera'>
<CompanyEmpty />
</TabPane>
<TabPane tab='订单信息' key='order'>
{
!customerItem.company
?
<CompanyEmpty />
:
<OrderList owner={customerItem.company} type='single'/>
}
</TabPane>
</Tabs>
</div>
</div>
}
}
//TabPane要一个一个写出来,不能用方法调用return 出来,如果用方法调用出来
,每一个TabPane方法就会调用2次
Ant design pro常用(9):Tabs的使用
最新推荐文章于 2025-04-01 11:33:36 发布