破折号异常 InvalidCallbackReturnValue

Question

我知道可能会问这个问题，但我找不到适合我的问题的解决方案。我正在尝试构建一个多布局 dash 应用程序。

我想在每次单击不同的选项卡（我有 3 个）时更改布局（其中包含 dcc.Graphs 和 dbc.Card）。问题是当我运行我的代码时出现此异常： "dash.exceptions.InvalidCallbackReturnValue: <Output content.children> 的回调返回类型为 Dash 的值这不是 JSON 可序列化的。 “

下面是我的代码：

import dash_bootstrap_components as dbc
import base64
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
from DashFriends import friends_layout
from DashUser import user_layout
from FriendsUserApp import userfriends_layout


app = dash.Dash(__name__, suppress_callback_exceptions=True, external_stylesheets=[dbc.themes.MINTY],
                meta_tags=[{'name': 'viewport',
                            'content': 'width=device-width, initial-scale=1.0'}]
                )
colors = {
    'background': '#ffffff',
    'text': '#4d94ff',
    'plot': '#D1D0CE',
    'textfig': '#000000'
}

app_tabs = html.Div(
    [
        dbc.Tabs(
            [
                dbc.Tab(label="My friends", tab_id="tab-friends", labelClassName="text-success font-weight-bold",
                        activeLabelClassName="text-danger"),
                dbc.Tab(label="Just me", tab_id="tab-user", labelClassName="text-success font-weight-bold",
                        activeLabelClassName="text-danger"),
                dbc.Tab(label="My Friends and I", tab_id="tab-userfriends",
                        labelClassName="text-success font-weight-bold",
                        activeLabelClassName="text-danger")
            ],
            id="tabs",
            active_tab="tab-user",
        ),
    ], className="mt-3"
)

app.layout = html.Div(style={'backgroundColor': colors['background']}, children=[
    html.H1(
        children='Twitter User Analysis',
        style={
            'textAlign': 'center',
            'font-family': 'Garamond',
            'font-weight': 'bold',
            'color': colors['text']
        }
    ),
    html.Div(children='Get an analysis of a user', style={
        'textAlign': 'center',
        'font-family': 'Garamond',
        'font-weight': 'bold',
        'color': colors['text']
    }),
    html.Br(),
    html.Hr(),
    dbc.Row(dbc.Col(app_tabs, width=12), className="mb-3"),
    html.Br(),
    html.Div(id='content', children=[])
])



@app.callback(
    Output(component_id="content", component_property="children"),
    [Input(component_id="tabs", component_property="active_tab")]
)

def switch_tab(tab_chosen):
    if tab_chosen == "tab-friends":
        return friends_layout
    elif tab_chosen == "tab-user":
        return user_layout
    elif tab_chosen == "tab-userfriends":
        return userfriends_layout
    return html.P("This shouldn't be displayed for now...")


if __name__ == '__main__':
    app.run_server(debug=True)

Answer 1

问题出在您未共享的代码中，但基于错误

dash.exceptions.InvalidCallbackReturnValue: The callback for <Output content.children> returned a value having type Dash which is not JSON serializable.

您在 switch_tab 回调中 return 的布局之一 return 是 Dash 应用程序的实例。

你不能这样做：

In general, Dash properties can only be dash components, strings, dictionaries, numbers, None, or lists of those.

破折号异常 InvalidCallbackReturnValue

dash exceptions InvalidCallbackReturnValue

python

callback

plotly-dash

dashboard