python - Plotly Dash 回调错误:试图隐藏 Div 组件
问题描述
Div
单击链接后,我试图隐藏输入组件。
我已经给出了 Div id='input_fields'
,以便我可以隐藏它的子组件,但是return app1.layout, {'display': 'none'}
我收到以下错误。
“回调错误更新 display-page.children, input_fields.children”
班级
app.layout = html.Div([
dcc.Location(id='url', refresh=False),
html.Br(),
html.H1("Interpretation of Financial Statements", style={'text-align': 'center'}),
html.H1("10 year data analysis", style={'text-align': 'center'}),
html.Div([dcc.Input(id='input-1-state', type='text', placeholder="Enter Company Ticker", value=''),
dcc.Input(id='input-2-state', type='text', placeholder="Enter Company Name", value=''),
dcc.Link(' Get Analytics ', href='/apps/app1')], id='input_fields'),
html.Div(id='display-page'),
], style={"margin-left": "5%", "margin-right": "5%"})
@app.callback(Output('display-page', 'children'),
Output('input_fields', 'children'),
[Input('url', 'pathname')],
Input(component_id='input-1-state', component_property='value'),
Input(component_id='input-2-state', component_property='value'))
def display_page(pathname, ticker, company):
if pathname == '/apps/app1':
# generate links
linkGenerator.generateLinks(ticker, company)
# starting crawler
startingCrawlerClass()
return app1.layout, {'display': 'none'}
else:
return ''
解决方案
else
问题是回调中子句的 return 语句。您的回调需要两个回调输出,但您返回一个(即单个空字符串)。
如果您在调试模式下运行应用程序,Dash 会告诉您这一点以及它希望您返回的内容:
dash.exceptions.InvalidCallbackReturnValue:回调 ..display-page.children...input_fields.children.. 是一个多输出。期望输出类型是列表或元组,但得到:''。
所以你可以这样做:
@app.callback(
Output("display-page", "children"),
Output("input_fields", "style"),
[Input("url", "pathname")],
Input(component_id="input-1-state", component_property="value"),
Input(component_id="input-2-state", component_property="value"),
)
def display_page(pathname, ticker, company):
if pathname == "/apps/app1":
return app1.layout, {"display": "none"}
else:
return '', {'display': 'block'}
所以上面的例子返回了一个包含两个元素的元组。每个元素对应一个回调输出。的输出input-field
也是style
推荐阅读
- swift - Firestore 数据库使用大量内存
- xcode - 目前不支持将快捷方式作为文件导入
- vue.js - Vue3 在哪里存储敏感的环境变量?
- c - 停止此 SUID 程序读取任何其他文件
- scala - 如何在 Spark 中获取数组列的所有组合?
- sorting - SAS 9.3 和 SAS 9.4 左连接排序顺序
- kubernetes - 无法通过 istio 使用浏览器从外部获取产品页面
- android - 在后台捕获屏幕截图
- oauth-2.0 - 对多个客户端的 Oauth2 权限
- java - Java:在已编译的 .jar 中读取图像/文件并抛出 NullPointerException