Error with Navlink

I’m running into a weird error that doesn’t give me a ton of information.

My web app has three pages: a home page, a graph page, and a prev-graph page. I have a navbar component that looks like this that is on each of those pages:

def navbar():
    navbar = dbc.Navbar(
        dbc.Container([
            html.A(
                dbc.Row([
                    dbc.Col(html.Img(src=calpine_logo, height='40px')),
                    dbc.Col(dbc.NavbarBrand('Calpine Monthly Report App', className='ms-2'))
                ],
                align='center', 
                className='g-0',
                justify='between',
                )
            ),
            dbc.NavbarSimple([
                dbc.NavLink('Home', href='/', style={'color': 'white'}),
            ],
            fluid=True, 
            color='#006699',
            dark=True)
        ],
        fluid=True),
        style={'display': 'flex', 'justify-content': 'space-between', 'font-weight': '600'},
        color='#006699',
        dark=True
    )
    return navbar

The NavLink directs back to the homepage. I get no error when I click that link from the graph page, but I get this error when I click it from the prev-graph page.

An object was provided as `children` instead of a component, string, or number (or list of those). Check the children property that looks something like:
{
  "props": {
    "pathname": "/",
    "href": "http://127.0.0.1:8050/"
  }
}

Any thoughts?

Also in conjunction with all these alerts:

Nevermind. I think I fixed it using a dcc.Location!

2 Likes

Hi @bpolasek, I am running into the same kind of error and have failed to find a fix so far. Do you mind sharing where/how you implemented the dcc.Location component?