React antd tabs切换造成子组件重复刷新

<Tabs
 activeKey={tabActiveKey}
 onChange={(key: string) => this.changeTab(key)}
 type="card"
>
  <TabPane tab={"对外授权"} key="/authed-by-me">
    <AuthedCollections
        collectionType={this.collectionType}
     />
  </TabPane>
  <TabPane tab={"申请权限"} key="/authed-to-me">
    <AuthedCollections
      collectionType={this.collectionType}
     />
  </TabPane>
</Tabs>


changeTab = (key: string) => {
 this.collectionType = key === '/authed-by-me' ? CollectionEnums.AUTHED_TO_GRANT : CollectionEnums.AUTHED_TO_APPLY;
 this.setState({
  tabActiveKey: key
 })
};

<Tabs
 activeKey={tabActiveKey}
 onChange={(key: string) => this.changeTab(key)}
 type="card"
>
 <TabPane tab={"对外授权"} key="">
 {
 this.collectionType === CollectionEnums.AUTHED_TO_GRANT &&
 <AuthedCollections
 collectionType={this.collectionType}
 />
 }
 </TabPane>
 <TabPane tab={"申请权限"} key="/authed-to-me">
 {
 this.collectionType === CollectionEnums.AUTHED_TO_APPLY &&
 <AuthedCollections
 collectionType={this.collectionType}
 />
 }
 </TabPane>
</Tabs>

{/ 查询区域