tabs Code:

             <Tabs tabs={tabs}
                  initialPage={0}
                  onChange={(tab, index) => this.onChangeTab(tab, index)}
                  onTabClick={(tab, index) => this.onClickTab(tab, index)}
            >
                <div style={{ height: "560px", backgroundColor: "-sharpfff" }}>
                    <Unaudited />
                </div>
                <div style={{ height: "560px", backgroundColor: "-sharpfff" }}>
                    <Through />
                </div>
                <div style={{ height: "560px", backgroundColor: "-sharpfff" }}>
                    <NotThrough />
                </div>
            </Tabs>
            
            

each tag content is imported with a component. When entering the tab page, only the content of the first two tags is requested, and the third tag is not loaded. What is the problem?
there is another question: when you switch tags, can the components corresponding to the tags be re-rendered every time?

Ladies and gentlemen, please take a look at ~