Black Lives Matter. Please consider donating to Black Girls Code today.

Dash Location keeps refreshing page

I would like my URL to serve as an input for a dropdown I have on the page, that filters the rest of the layout. However, dcc.Location () keeps refreshing the page automatically before any data can load. I’ve written the main components of my code below.

layout = html.Div(children=[
    dcc.ConfirmDialog(
        id='error',
        message='You have input an incorrect run. Click either "Ok" or "Cancel" to return to the most recent run.'
    ),
    dcc.Dropdown(
        id='run_select',
        options=[{'label': r, 'value': r} for r in all_runs],
        clearable=False
    ),
    dcc.Location(
        id='url',
        refresh=False
    ),

@app.callback(
    [dep.Output('run_select', 'value'),
     dep.Output('error', 'displayed')],
    [dep.Input('url', 'pathname')]
)
def change_url(pathname):
    if pathname == "/" or pathname is None:
        return all_runs[0], False
    elif pathname[1:] not in all_runs:
        return all_runs[0], True
    else:
        return pathname[1:], False

I had this issue as well. In my case I was using a multi-page app with the structure outlined here. In my index.py I had a Location object with id=‘url’ and in one of my child apps I also created a Location object with id=‘url’. This caused my index.py to continually reload. I changed the id on my child app and it seems to have solved the issue.