建设银行网站,公司网站如何做,typecho 企业网站,优质的小企业网站建设模式匹配
模式匹配回调选择器 MATCH、ALL 和 ALLSMALLER 允许您编写可以响应或更新任意或动态数量组件的回调函数。 此示例呈现任意数量的 dcc. Dropdown 元素#xff0c;并且只要任何 dcc. Dropdown 元素发生更改#xff0c;就会触发回调。尝试添加几个下拉菜单并选择它们的…模式匹配
模式匹配回调选择器 MATCH、ALL 和 ALLSMALLER 允许您编写可以响应或更新任意或动态数量组件的回调函数。 此示例呈现任意数量的 dcc. Dropdown 元素并且只要任何 dcc. Dropdown 元素发生更改就会触发回调。尝试添加几个下拉菜单并选择它们的值以查看应用程序如何更新。 效果
代码
# 导入Dash库及其相关组件
from dash import Dash, dcc, html, Input, Output, ALL, Patch, callback# 创建一个Dash应用实例
app Dash(__name__)# 设置应用的布局
app.layout html.Div([# 添加一个按钮用于添加过滤器id为add-filter-btn并设置初始点击数为0 html.Button(添加过滤器, idadd-filter-btn, n_clicks0),# 创建一个div容器用于存放下拉菜单组件id为dropdown-container-div初始子元素为空 html.Div(iddropdown-container-div, children[]),# 创建一个div容器用于显示下拉菜单的选择结果id为dropdown-container-output-div html.Div(iddropdown-container-output-div),]
)# 定义一个回调函数当add-filter-btn按钮被点击时触发
callback(# 设置输出目标为dropdown-container-div的子元素 Output(dropdown-container-div, children),# 设置输入源为add-filter-btn的点击事件 Input(add-filter-btn, n_clicks)
)
def display_dropdowns(n_clicks):# 创建一个Patch对象用于存放新的下拉菜单组件 patched_children Patch()# 创建一个新的下拉菜单组件包含四个城市选项id根据点击次数动态生成 new_dropdown dcc.Dropdown([NYC, MTL, LA, TOKYO],id{type: city-filter-dropdown, index: n_clicks},)# 将新的下拉菜单组件添加到Patch对象中 patched_children.append(new_dropdown)# 返回Patch对象更新dropdown-container-div的子元素 return patched_children# 定义一个回调函数当下拉菜单的值发生变化时触发
callback(# 设置输出目标为dropdown-container-output-div的子元素 Output(dropdown-container-output-div, children),# 设置输入源为所有city-filter-dropdown类型的下拉菜单的值变化事件 Input({type: city-filter-dropdown, index: ALL}, value),
)
def display_output(values):# 遍历所有下拉菜单的值创建一个包含结果的div组件列表 return html.Div([html.Div(f下拉菜单 {i 1} {value}) for (i, value) in enumerate(values)])# 当脚本作为主程序运行时启动Dash应用并开启调试模式
if __name__ __main__:app.run(debugTrue)上一篇
