Access component (dcc.Store) property (data) outside of callback?

Dash Python
2

Hi,

You can’t access them outside the callback, but you can write a callback that updates a page container and use functions (or just write some logic) to create its children. Dummy example:

app.layout = html.Div(
    [
        dcc.Upload(...),
        dcc.Store(id="store", data=dict(dropdown=["a", "b"]),
        html.Div(id="container"), 
     ]
)


@callback(
    Output("container", "children"),
    Input("store", "data")
)
def update_page(data):
    children = []
    if "dropdown" in data:
        dd_options = data["dropdown"]
        dd = dcc.Dropdown(dd_options, dd_options[0], id="dropdown")
        children.append()
    return children

You can of course create one “container” component to be updated by values in the Store or change individual props instead of recreating them, i.e. to do the followign in the example above:

@callback(
    Output("dropdown", "options"),
    Input("store", "data")
)
def update_page(data):
    children = []
    if "dropdown" in data:
        return data["dropdown"]

The right approach depends a lot on what the other callbacks do, as you must make sure that you won’t have missing Input/Output when they are triggered (see here). Besides, app.validation_layout can be helpful for you.

Lastly, in some simple cases, you can benefit from writing the components as dictionaries as in this old thread.

Hope this helps!

1 Like