Я создаю приложение с несколькими вкладками, используя компонент ExtReact TabPanel.Поведение по умолчанию, по-видимому, заключается в том, что все вкладки отображаются при отображении панели вкладок.Однако я хочу отображать только активную вкладку и отображать ее только при первом нажатии (то есть, если пользователь не сделает что-то на вкладке, чтобы потребовать повторного отображения).Я играл со слушателями и событием активации, но я не настолько знаком с набором элементов управления, чтобы знать, что я делаю.Ниже приведено то, что я имею до сих пор, и кажется, что вкладки отображаются даже до того, как событие активации было запущено, поэтому не уверен, что это правильное место для этого.
<TabPanel
id="adminTabs"
flex={1}
shadow
defaults={{
cls: "card",
layout: "center"
}}
listeners= {{
scope: this,
activate: (newActiveItem, tab, oldActiveItem, eOpts) => {
//alert(JSON.stringify(newActiveItem.id))
},
//activeItemChange: ( sender, value, oldValue, eOpts ) => {
// alert(value.id)
// alert(oldValue.id)
//}
}}
>
<Container id="lookupsTab" title="Lookups" layout="center">
<Container layout="fit" fullscreen><LookupsLanding/></Container>
</Container>
<Container title="Configuration" layout="center">
<Container>Configuration Content</Container>
</Container>
<Container id="usersTab" title="Users" layout="center">
<Container layout="fit" fullscreen><UsersLanding/></Container>
</Container>
<Container title="Application Errors" layout="center">
<Container>Application Errors Content</Container>
</Container>
</TabPanel>