如何在Streamlit的st_aggrid单元格中实现多选功能？

要将原有的单选配置改为多选，核心是替换单元格编辑器并配置值格式化逻辑，具体方案如下：

关键修改点 #

• 将cellEditor从单选的agSelectCellEditor替换为多选专用的agMultiSelectCellEditor
• 添加valueFormatter将多选返回的数组转换为逗号分隔的字符串，优化显示效果
• 保留原有的选项列表配置，可按需添加编辑器的显示优化参数

完整代码示例 #

import streamlit as st
from st_aggrid import AgGrid, GridOptionsBuilder
import pandas as pd

# 创建测试数据
df = pd.DataFrame({
    'source': [['source1'], [], ['source2', 'source3']],
    'other_column': ['示例数据1', '示例数据2', '示例数据3']
})

# 构建Grid配置
gb = GridOptionsBuilder.from_dataframe(df)
gb.configure_column(
    'source',
    width=500,
    editable=True,
    cellEditor='agMultiSelectCellEditor',  # 启用多选编辑器
    cellEditorParams={
        "values": ["source1", "source2", "source3"],  # 选项列表
        "cellRenderer": "agGroupCellRenderer"  # 可选：优化下拉选项的显示样式
    },
    # 将选中的数组转为逗号分隔的字符串显示
    valueFormatter="params.value ? params.value.join(', ') : ''"
)
grid_options = gb.build()

# 渲染表格
grid_response = AgGrid(
    df,
    gridOptions=grid_options,
    editable=True,
    return_dataframe=True
)

# 可选：处理更新后的数据（将数组转为字符串）
updated_df = grid_response['data']
updated_df['source'] = updated_df['source'].apply(lambda x: ', '.join(x) if x else '')
st.write("更新后的数据：", updated_df)

说明 #

1. 多选编辑器agMultiSelectCellEditor是agGrid原生组件，支持用户选择多个选项
2. valueFormatter确保单元格显示的是逗号分隔的文本，而非原始数组
3. 如果需要对用户选择的结果做后续处理，可从grid_response['data']中获取数组格式的选中值，再按需转换为字符串

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