如何在Plotly的Dash框架中限制Checklist组件的复选框选中数量

核心实现逻辑为通过Dash回调监听Checklist的选中值，当选中数量超过预设阈值时截断超出部分即可，无需修改组件原生属性。

• 第一步：导入所需依赖

from dash import Dash, dcc, html, Input, Output, callback

• 第二步：定义页面布局与最大选中阈值
  你可以自行调整MAX_SELECTED的数值匹配实际业务需求，示例中设置为最多选中2项：

app = Dash(__name__)

MAX_SELECTED = 2  # 自定义最大可选中数量

app.layout = html.Div([
    dcc.Checklist(
        id='limit-checklist',
        options=[
            {'label': '选项1', 'value': 'opt1'},
            {'label': '选项2', 'value': 'opt2'},
            {'label': '选项3', 'value': 'opt3'},
            {'label': '选项4', 'value': 'opt4'}
        ],
        value=[]
    ),
    html.Div(id='select-notice', style={'margin-top': '10px', 'color': '#666'})
])

• 第三步：编写数量限制回调函数
  当选中数量超过阈值时，默认保留最早选中的项，截断最新选中的超出部分；如果需要优先保留最新选中的项，可将截断逻辑调整为selected[-MAX_SELECTED:]：

@callback(
    Output('limit-checklist', 'value'),
    Output('select-notice', 'children'),
    Input('limit-checklist', 'value'),
    prevent_initial_call=True
)
def limit_checkbox_selected(selected_values):
    if len(selected_values) > MAX_SELECTED:
        # 截断超出的选中项
        return selected_values[:MAX_SELECTED], f'⚠️ 最多仅可选择{MAX_SELECTED}个选项'
    return selected_values, f'已选中{len(selected_values)}/{MAX_SELECTED}个选项'

if __name__ == '__main__':
    app.run_server(debug=True)

该方案兼容所有版本的dcc.Checklist组件，无需依赖额外第三方插件，性能开销极低，适合绝大多数业务场景使用。

内容的提问来源于stack exchange，提问作者Aditya Jain