Plotly Dash - 使用 dcc.Loading 加载 Dash 时禁用按钮

Question

我试图在处理破折号中的请求时禁用按钮。 目前我已经实现了这个（Display loading symbol while waiting for a result with plot.ly Dash）。我正在尝试弄清楚如何在进行长查询时禁用按钮。

这是我尝试过的逻辑：

逻辑 1：（我收到循环依赖错误）

• 卡拉克01：

  • 输入：按钮 n_click
  • 输入：DIV 上次更新（如果已填充 DIV 子项，请将按钮禁用设置为 false）
  • 输出：按钮禁用（如果按钮 no_click 设置为 true）

• 回调 02：

  • 输入按钮 n_click
  • 输出 DIV 上次更新

逻辑 2：（由于两个 CB 的输出相同而导致错误）

• 回调 01：

  • 输入按钮 n_click
  • 输出按钮已禁用
  • 输出上次更新

• 回调 02：

  • 输入最后更新的孩子
  • 输出按钮已禁用

我还尝试使用按钮进行 dcc.Loading。我可以激活微调器，但按钮保持启用状态。

html.Div([dbc.Button("load data", id="but-data", className="mr-2", disabled=False), dcc.Loading(id="loading-1", type="default", children=html.Div(id="loading-output-1"))]),

有什么建议吗？

Answer 1

我遇到了类似的问题。我使用全局 computing 变量和子更新回调解决了它：

computing = False

#example definition
button = dbc.Button([dbc.Spinner([],id='spinner') ], id ='button', block=True, id = id)
## app code here

<your code>

### callback on click

@app.callback([Output("button",'disabled'),Output("spinner",'children')],Input('button','n_clicks'))
def updatefn(input):
    global computing
    if computing:
        return True,[dbc.Spinner(color="light",size='sm')]

    else:
       computing = True
       do something

      # finish
      computing = False
       return False,[] 

此方法不再执行该函数，并在计算期间禁用按钮。