python - Dash(Python) - 无法根据另一个 slider 的输入更新 slider 的值

Question

我已经开始学习 Dash(使用 R-Shiny 约 3 个月后)。在此期间，我尝试制作一个应用程序，它将有两个 Slider，其中之一的值(min, max, step)是固定的，其他 Slider 的值将根据第一个 Slider 的输入进行更新。我无法更新第二个 Slider 的值。
这是我所做的和尝试过的:

from dash import Dash
import dash_html_components as dash_html
import dash_core_components as dash_core
from dash.dependencies import Input, Output
from flask import Flask

# initiate the dash app with Flask server
app = Dash(__name__, server=Flask(__name__))


# code the ui now
app.layout = dash_html.Div(children=[
    dash_core.Slider(id="first_slider",
                     min=10, max=110, value=10, step=10,
                     marks={i : '{}'.format(i) for i in range(10,110,10)},
                     # marks={i : 'Level {}'.format(i) for i in range(10,110,10)}
                     ),
    dash_html.Hr(), dash_html.Hr(),

    # second slider
    dash_core.Slider(id="second_slider"),
    # # dash_html.Hr(),

    # print values from both sliders
    dash_html.Div(id="display_selected_values"),
    ])


# take the input from first and update second slider
@app.callback(Output(component_id='second_slider', component_property=['min','max']),
                                           # component_property='children'),
                                           # component_property='value'),
              [Input(component_id='first_slider', component_property='value')])
def print_the_value_from_slider(value_from_slider):
    # update the values of second slider. ex: if input is 10, second slider will have 11 to 20
    # return value_from_slider
    return list((value_from_slider+1, value_from_slider+1+10))

# @app.callback(Output(component_id="second_slider", component_property='options'),
#               [Input(component_id='second_slider', component_property='value')])
# def fill_second_slider(value_from_first_slider):
#     return range(value_from_first_slider+1, value_from_first_slider+1+10, 1)


# @app.callback(Output('display_selected_values', 'children'),
#               [Input('first_slider', 'value'),
#                Input('second_slider', 'value')])
# def set_display_children(first_input, second_input):
#     return '{} from {}s range'.format(second_input, first_input)

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

错误是:

dash.exceptions.NonExistentPropException: 
Attempting to assign a callback with
the property "['min', 'max']" but the component
"second_slider" doesn't have "['min', 'max']" as a property.

Here are the available properties in "second_slider":
['id', 'marks', 'value', 'className', 'disabled', 'dots', 'included', 'min', 'max', 'tooltip', 'step', 'vertical', 'updatemode', 'loading_state']

但是，Slider 确实具有 min 和 max 属性，并且它们也列在错误中。我不知道我做错了什么。但是，第二个 slider 没有更新。

Answer 1

slider 确实有 min 和 max 属性，但您尝试设置一个属性 [min, max]不存在。您的回调需要两个输出，每个 prop 一个。

@app.callback([Output(component_id='second_slider', component_property='min'),
               Output(component_id='second_slider', component_property='max')]
              [Input(component_id='first_slider', component_property='value')])

这应该有效。