I’m currently developing a dashboard that uses several pages, using dbc.nav to navigate between pages.
The layout is basically something like (i’m translating from Julia so there might be some typos) :
app.layout = html.Div([ dcc.Location(id="url"), dbc.Navlink(id="page-home", href="/home") dbc.Navlink(id="page-visu", href="/visu") dcc.Store(id="store"), html.Div(id='page_content') ])
@app.callback( Output("page-content", 'children'), Input("url", "pathname") ) def render_content(pathname): if pathname = "/home": return homePageLayout elif pathname == "/visu": return visuPageLayout
Inside homePageLayout, i want to have a button that loads data on clicks, we have then something like
visuPageLayout = html.Div([dbc.Button(id="load-button")])
with the callbacks
@app.callback(Output("store", "data"), [Input("load-button", "n_clicks")]) def load_data(n_clicks): if not (n_clicks is None): return my_data
So, when i go to Home page and load data, I can go to Visu page and use those data.
However, when I go back to Home, since the load button callback is fired with None value and return nothing, dcc.Store is emptied and I have to reload data…
One solution could be to load data even if n_clicks is None, but in my case it takes about ten seconds to load those data, and I want to load data only if i click on load button.
Is there anyway to prevent load_button callback on every Homepage refresh ? It would prevent dcc.Store to be emptied each time.
If not, is there any other solution to implement what I want to do ? (ie : load data with button on a children page, and use those data on an other children page).
Much thanks !