使用清除按钮清除破折号中下拉菜单的值时出错

Question

我正在尝试向用户提供一个选项，以通过清除按钮清除下拉菜单中输入的值，但在运行应用程序时，我收到以下错误（因此我无法在下拉菜单）：

无法读取 null 的属性“长度”

这是清除按钮的代码：

html.Button('Clear', id = 'clear', n_clicks = 0, style={'color' : '#FFFFFF', 'fontSize' : '12px', 'width': '150px'})

这是我的清除功能代码：

@app.callback(  
    Output('Month', 'options'),
    [Input('clear', 'n_clicks')]
)
def clearDropDown1(n_clicks):
        if n_clicks: 
            return None

Answer 1

谢谢。我已经在本地运行它，问题是由回调引起的。它将options 属性更新为None，并且应用程序无法读取该属性length（JS 中的null）。

您的回调可以采用这样的形式（对我有用）：

@app.callback(
    Output('Month', 'options'),
    [Input('clear', 'n_clicks')]
)
def clearDropDown1(n_clicks):
    if n_clicks:
        return []
    return [{'label': 'January', 'value': 1}, {'label': 'February', 'value': 2},
                          {'label': 'March', 'value': 3}, ]

问题是，当您单击按钮时，回调中将不再有任何选项。你知道有一个clearable 属性可以让用户取消他们所做的选择吗？

编辑：

为了回应您的评论，您将需要一个多输出回调。它将采用这种形式：

@app.callback(
    [
        Output('Month', 'options'),
        Output('Year', 'options'),
        ...
    ],
    [Input('clear', 'n_clicks')]
)
def clearDropDown1(n_clicks):
    if n_clicks:
        return [], [], ...
    return [{'label': 'January', 'value': 1}, {'label': 'February', 'value': 2},
                          {'label': 'March', 'value': 3}, ],
        [{'label': 2020, 'value': 2020}, {'label': 2019, 'value': 2019}], ...

函数必须为装饰器中的每个Output 返回一个值。我会说你可能需要更新 value 属性而不是选项，如果你想让它像清除按钮一样一起工作。