Dash(Python) - 无法根据来自另一个 Slider 的输入更新 Slider 的值

Question

我已经开始学习 Dash（在使用 R-Shiny 大约 3 个月后）。在此期间我尝试制作一个应用程序，该应用程序将有两个Sliders，其中一个值（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 属性，它们也被错误地列出。我不知道我做错了什么。但是，第二个滑块没有更新。

Answer 1

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

@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')])

应该可以的。