Alright, because you CREATE the layout each time your tab changes, you will automatically lose the current data. What you could do is store the data OUTSIDE of the tab (dcc.Storage or json in hidden Div) when your user interacts with it. You can then include it in the callback as State. If “your_existing_data” exists, then change the initial value in your layout. That’d be one way to do it.
On my app, I use Tabs/Tab in 2 different ways.
Case 1:
The content of my webpage is OUTSIDE of the tabs. Its a big “html.Div” that updates based on the selected tab. So everytime you click on a tab, I completely recreate the layout of the page, and the previous data is not saved. That’s the example you see in the guide.
Case 2:
I use “normal” tabs, meaning the content is WITHIN the dcc.Tab element. Tab elements are kind of like a Div, if you click on a tab, you see its contents (without callbacks). That way, each Tab has its own layout that is loaded at the beginning. Changing tab does not impact its values (unless you have specific callbacks from one tab to another).
To give you an actual example:
- In one tab I load a CSV
- Which creates graphs and other dcc elements in the other tabs
- I can then switch to any tab to view its content (without callbacks) because the layout is INSIDE the tab and clicking on a tab automatically shows its content (that’s included in the normal tab behaviour, not related to callbacks)