Create a dcc.Store component inside callback

Dash Python
4

Hey @xaver, here an example to get you started:

from dash import Dash, html, Input, Output, Patch, dcc, MATCH


def create_content(idx):
    return html.Div([
        dcc.Store(id={"type": "store", "index": idx}),
        dcc.Dropdown(id={"type": "drop", "index": idx}, options=[1, 2, 3]),
        html.Div(id={"type": "output", "index": idx}, children=[]),
    ])


app = Dash(
    __name__,
    suppress_callback_exceptions=True
)


app.layout = html.Div([
    html.Button(id="btn", children="create Store + drop down"),
    html.Div(id="container", children=[])
])


@app.callback(
    Output("container", "children"),
    Input("btn", "n_clicks"),
    prevent_initial_call=True
)
def update(idx):
    patched = Patch()
    patched.append(create_content(idx))
    return patched


@app.callback(
    Output({"type": "output", "index": MATCH}, "children"),
    Input({"type": "drop", "index": MATCH}, "value"),
    prevent_initial_call=True
)
def generate_output(value):
    return {
        1: "option 1",
        2: "option 2",
        3: "option 3"
    }[value]


if __name__ == "__main__":
    app.run(debug=True)

Maybe you were just missing the prevent_initial_call=True…

mred pmcb

1 Like