Dash Plotly多页面问题：仅仪表盘可见，如何显示数据表页面？

问题分析 #

你当前的代码是在单Dash应用内做路由切换，所有页面都在同一个窗口的内容区切换，无法直接实现独立窗口/标签页展示。要达成需求，有两种可行方案：

方案1：启动两个独立的Dash应用实例 #

分别为仪表盘（app1）和数据表（app2）启动独立服务，监听不同端口，就能在不同标签页/窗口通过不同地址访问。

修改步骤： #

1. 调整app1和app2的代码，各自添加独立启动入口：
   • app1.py：

     import dash
     from dash import html
     
     app = dash.Dash(__name__)
     app.layout = html.Div([html.H1('仪表盘页面')])
     
     if __name__ == '__main__':
         app.run_server(debug=True, port=8050)
     

   • app2.py：

     import dash
     from dash import html, dash_table
     
     app = dash.Dash(__name__)
     app.layout = html.Div([
         html.H1('数据表页面'),
         dash_table.DataTable(data=[{'col1': 'a', 'col2': 'b'}], columns=[{'name': '列1', 'id': 'col1'}, {'name': '列2', 'id': 'col2'}])
     ])
     
     if __name__ == '__main__':
         app.run_server(debug=True, port=8051)
     

2. 分别运行两个应用：
   • 打开终端执行python app1.py，访问http://localhost:8050查看仪表盘
   • 打开另一个终端执行python app2.py，访问http://localhost:8051查看数据表

方案2：在主应用中添加打开新窗口的链接 #

如果希望保留主应用的路由结构，同时支持点击链接打开新窗口展示页面，可以通过html.A标签的target="_blank"属性实现：

修改主应用代码： #

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

app = dash.Dash(__name__)

app.layout = html.Div([
    # 导航链接，target="_blank"指定在新窗口打开
    html.Div([
        html.A('打开仪表盘', href='/app1', target='_blank', style={'margin-right': '20px'}),
        html.A('打开数据表', href='/app2', target='_blank')
    ]),
    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)

说明： #

• 点击链接时会自动在新标签页打开对应页面，主窗口可保留导航栏
• 若应用启用了权限验证（如dash-auth），新窗口需要重新验证，这种场景下方案1更稳妥

内容的提问来源于stack exchange，提问作者Burak