如何在破折号应用程序中延迟用户对文本框的输入？

Question

我正在学习构建一个简单的破折号应用程序。它有一个用于用户输入的文本框，这取决于它将绘制图形。

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output

app = dash.Dash()

app.layout = html.Div(children=[
    html.Div(children='User input:'),
    dcc.Input(id='input', value='', type='text'),
    html.Div(id='output-graph'),
])

@app.callback(
    Output(component_id='output-graph', component_property='children'),
    [Input(component_id='input', component_property='value')]
)
def update_value(input_data):
    return dcc.Graph(
    ### Do something ###
    )

问题是，由于 dash 在后台使用 react，所以只要输入输入，它就会在控制台中不断抛出错误，直到到达有效输入为止。例如，如果我正在为一个股票代码（例如 AAPL）绘制股票价格，它会在输入每个字母后抛出错误，直到输入所有 4 个有效字母。

我想在应用程序尝试读取输入之前用户输入最后一个字符后添加 1 秒的延迟。我怎么做？我一直在网上搜索这个，但找不到任何东西。

此外，如果 1 秒延迟后的输入是无效输入（例如，AAPF 而不是 AAPL），它应该返回类似的内容， Wrong input, please enter again.

Answer 1

老问题，但我在搜索同样的东西时遇到了它。我随后在 plotly 论坛上发现，debounce关键字参数被添加到 dash 核心组件中（从 0.35.0. 版本开始）。如果debounce是True，则输入的内容将不会被传达，直到用户按下回车键或点击框外。

例如：

dcc.Input(
    id='user-input',
    type='number',
    value=30,            
    style={'fontSize':28},
    debounce = True
),