如何更新 Dash dcc 中的链式下拉值？

Question

在破折号中，如何将一个下拉列表的值更新到另一个清单或滑块中？ 在下面的代码中，我从下拉列表中选择一个值，该值应该根据从下拉列表中选择的值更新清单值。 在这里，我部分成功地从下拉列表中获取了值，但它正在与 checklist 中较旧的选定值一起累积。 请在下面找到代码的一部分。

import dash
from dash.dependencies import Input, Output, State
import dash_core_components as dcc
import dash_html_components as html
import dash_table
import pandas as pd
from dash.exceptions import PreventUpdate

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
app.config['suppress_callback_exceptions'] = True

app.layout = html.Div([
                dash_table.DataTable(
                        id='datatable-upload-container',
                        columns=[{"name": i, "id": i} for i in df.columns],
                        data=df.to_dict('records'),
                        ),
                html.Div(dcc.Dropdown(
                    id='data_selector1',
                    options=[
                        {'label': '', 'value': ''}
                        ],
                    value=[]
                    )
                ),
                html.Br(),
                html.Div([
                    html.Div(id='numerical-slider'),
                    # this is a hack: include a hidden dcc component so that
                    # dash registers and serve's this component's JS and CSS
                    # libraries
                     dcc.Input(style={'display': 'none'})
                ])
           ])

@app.callback(Output('data_selector1', 'options'),
              [Input('datatable-upload-container', 'data')])
def update_dropdown(rows):
    print('updating menus')
    numerical_col = [i for i in df.columns if df[i].dtypes != "object"]
    col_labels=[{'label' :k, 'value' :k} for k in numerical_col]
    return col_labels

@app.callback(Output('numerical-slider','children'),
              [Input('data_selector1', 'value'),
              Input('datatable-upload-container', 'data')])
def explanatory_cat_slider(value, rows):
    if value:
        categories, intervals = pd.cut(df[value], 3, retbins=True)
        return html.Div(html.Label([value,
                            dcc.RangeSlider(id='numerical-slider',
                               min=min(intervals),
                               max=max(intervals),
                               step=None,
                               marks={str(val): str(round(val,2)) for val in intervals},
                               value = [intervals[0],intervals[-1]]
                               )
                            ],style={'width': '50%', 'display': 'inline-block', 'textAlign': 'left'})
                        )
    else:
        return []

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

更新的代码...我遇到了关于explanatory_cat_slider的问题，它没有使用新的选定值进行更新。

在第一张图片中，我可以选择一个下拉值，它会自动显示该值的滑块

在第二个图像滑块上越来越多。 我该如何解决这个问题？

在最后一张图片中，它是如何变成滑块重叠的

Answer 1

您发布的代码不完整，因为您的回调中有 Input ID data_selector和 ID datatable-upload-container ，但它们在您的layout不存在。 我可以看到，回调将其产量的问题为好，因为它试图更新children的categorical-checklist与包含相同的ID的元素。 这将导致您的布局中出现非唯一 ID，从而导致中断。

我可能可以帮助完成更多的代码，但本质上，您有正确的想法来检查if value:并在该块中运行您的代码。 确保您不要让回调无声地结束，因为这将返回None并给您带来麻烦。 您应该在末尾或else:块中包含return []或return ''以防止这种情况发生，并保持children组件有效，即使只有空值。

您还应该在初始布局中包含dcc.Checklist 。 给它options=[]开始并让你的回调更新它的options道具。 这应该可行，但是，如果仍然存在问题，请更新您发布的代码，我再看看。