多页破折号

Question

使用 Dash Plotly，我创建了一个仪表板和一个数据表。我想将它们显示在两个单独的页面上。当我运行代码时，只有仪表板可见。如何在不同的窗口或选项卡中显示数据表？

import dash
from dash import html
from dash import dcc
from dash.dependencies import Input, Output
from dash.exceptions import PreventUpdate
from dash import dash_table
from app1 import app as app1
from app2 import app as app2

app = dash.Dash(__name__)

app.layout = html.Div([
dcc.Location(id='url', refresh=False),
html.Div(id='page-content')
])

@app.callback(Output('page-content', 'children'),
          [Input('url', 'pathname')])
def display_page(pathname):
    if pathname == '/app1':
        return app1.layout
    elif pathname == '/app2':
        return app2.layout
    else:
        return '404 - Not Found'

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

Answer 1

您可以在plotly dash中使用多页url来实现此目的：https://dash.plotly.com/urls

这是破折号多页的最小工作示例（大部分是从破折号图 - 多页中的示例之一复制的）。您可以根据您的布局和数据修改它。

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

app = Dash(__name__)

app.layout = html.Div([
    dcc.Location(id='url', refresh=False),
    html.Div(id='page-content')
])

index_page = html.Div([
    html.H1('Welcome to the Multi-Page App Demo'),
    html.A('Go to Page 1', href='/page-1', target='_blank'),
    html.Br(),
    html.A('Go to Page 2', href='/page-2', target='_blank'),
])

page_1_layout = html.Div([
    html.H1('Page 1'),
    html.P('This is the content of Page 1.'),
    html.Br(),
    html.A('Go to Page 2', href='/page-2', target='_blank'),
    html.Br(),
    html.A('Go back to home', href='/', target='_blank'),
])

page_2_layout = html.Div([
    html.H1('Page 2'),
    html.P('This is the content of Page 2.'),
    html.Br(),
    html.A('Go to Page 1', href='/page-1', target='_blank'),
    html.Br(),
    html.A('Go back to home', href='/', target='_blank'),
])

@app.callback(Output('page-content', 'children'), Input('url', 'pathname'))
def display_page(pathname):
    if pathname == '/page-1':
        return page_1_layout
    elif pathname == '/page-2':
        return page_2_layout
    else:
        return index_page

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