使用ComboBoxListItemPicker人员字段遇400错误及显示异常求助

问题分析 #

你遇到的核心问题是：

• 直接指定columnInternalName='Author/Title'时，控件生成的查询缺少$expand=Author，导致400错误
• 手动在filter里追加&$expand=Author后，虽然能获取数据，但控件无法正确解析Author/Title这种嵌套路径，找不到对应字段值，所以下拉框显示为空

解决方案 #

1. 优先使用控件原生的expand属性（如果支持）

大部分SharePoint Framework控件（包括此类Picker控件）都提供了专门的expand属性来处理Lookup字段的展开，不需要通过filter拼接。同时调整columnInternalName为Lookup字段本身（即Author），再自定义显示逻辑：

<ComboBoxListItemPicker       
  listId='<LIST_ID>'       
  columnInternalName='Author' // 改为Lookup字段的内部名称，而非嵌套属性
  keyColumnInternalName='ID'
  expand='Author' // 原生expand属性，自动添加到查询中
  webUrl='<WEB_URL>'
  defaultSelectedItems={[]}
  onSelectedItem={(items: any) => { console.log(items); }}       
  className='myComboBoxListItemPicker'
  placeholder="Select an item"
  displayField={(item) => item.Author?.Title} // 自定义提取显示文本
/>

2. 自定义下拉项渲染（如果控件不支持函数式displayField）

如果控件的displayField仅支持字符串，可通过renderItem属性自定义每个下拉项的渲染内容：

<ComboBoxListItemPicker       
  listId='<LIST_ID>'       
  columnInternalName='Author'
  keyColumnInternalName='ID'
  expand='Author'
  webUrl='<WEB_URL>'
  defaultSelectedItems={[]}
  onSelectedItem={(items: any) => { console.log(items); }}       
  className='myComboBoxListItemPicker'
  placeholder="Select an item"
  renderItem={(item) => {
    return <span>{item.Author?.Title || '无作者'}</span>;
  }}
/>

3. 若控件无原生expand属性，继续用filter但调整字段映射

如果控件确实没有expand属性，保留filter='&$expand=Author'的配置，但同样需要修改columnInternalName为Author，并通过自定义显示逻辑提取Title：

<ComboBoxListItemPicker       
  listId='<LIST_ID>'       
  columnInternalName='Author'
  keyColumnInternalName='ID'
  filter='&$expand=Author'
  webUrl='<WEB_URL>'
  defaultSelectedItems={[]}
  onSelectedItem={(items: any) => { console.log(items); }}       
  className='myComboBoxListItemPicker'
  placeholder="Select an item"
  displayField={(item) => item.Author?.Title}
/>

原理说明 #

当你指定columnInternalName='Author/Title'时，控件会尝试在返回的item对象中直接读取item['Author/Title']，但实际展开Author后，数据结构是item.Author.Title，控件无法识别这种斜杠分隔的嵌套路径，因此显示为空。通过将columnInternalName改为Lookup字段本身，并自定义显示逻辑提取嵌套属性，就能解决这个问题。

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