Question

我正在使用DASH库，我的应用程序现在具有多个选项卡，但是我需要使每个选项卡具有不同的URL，有人能做到吗？

Answer 1

如果要在选择新标签后更改地址栏中显示的URL，可以添加dcc.Location组件并使用dcc.Link组件来选择标签。 dcc.Location组件是选项卡更改的输入。

官方文档中的示例执行以下操作：

https://dash.plot.ly/urls

Answer 2

@papalagi here建议，对我有用的唯一方法是使用两个dcc.Location组件（一个用作“输入” URL，一个用作“输出” URL）并编写两个回调：

更改网址（dcc.Location）并更新所选标签（dcc.Tabs）时触发的一个
当所选标签更改（dcc.Tabs）并更新显示的网址（dcc.Location）时触发的另一个

由于这种情况意味着循环依赖，因此它说明了需要两个dcc.Location对象。

通过查看代码，我实现了一个解决方案，其中每个选项卡在同一页面中都有自己的哈希，但是可以更改此方法以更新整个路径而不是哈希。

首先，在应用的布局中，我包括两个dcc.Location组件。

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

然后，我编写回调：

@app.callback(
    inputs=[Input('url', 'hash')],
    output=Output('main-tabs', 'value'))
def update_tab(hashh):
    print('>>> UPDATE TAB', hashh)
    return hash_tabs_value_dict.get(hashh.lstrip('#'), 'tab-1')


@app.callback(
    inputs=[Input('main-tabs', 'value')],
    output=Output('url-output', 'hash'))
def update_tab_hash(tab_value):
    print('>>> UPDATE HASH', tab_value)
    return '#' + tabs_value_hash_dict.get(tab_value, '')

P.S。在hash_tabs_value_dict和tabs_value_hash_dict中，我有几个字典来存储制表符值（'tab-1'，'tab-2'，...）和所需的期望值之间的映射显示。

如何使破折号中的选项卡具有不同的URL？

2 个答案: