Ant Design TreeSelect选项内容被截断？求助排查原因

我使用Ant Design的TreeSelect组件实现站点筛选功能，当前用模拟数据测试（数据结构与实际数据完全一致）。遇到的问题是：当选中两个父节点时，子节点展开显示正常；但仅选中一个父节点时，另一个父节点及其子节点会被截断，无法完整显示。

代码实现 #

export const SiteFilter = () => {
  const treeData = [
    {
      value: 'parent 1',
      title: 'parent 1',
      children: [
        {
          value: 'parent 1-0',
          title: 'parent 1-0',
          children: [
            { value: 'leaf1', title: 'leaf1' },
            { value: 'leaf2', title: 'leaf2' },
            { value: 'leaf3', title: 'leaf3' },
            { value: 'leaf4', title: 'leaf4' },
            { value: 'leaf5', title: 'leaf5' },
            { value: 'leaf6', title: 'leaf6' },
          ],
        },
        {
          value: 'parent 1-1',
          title: 'parent 1-1',
          children: [
            {
              value: 'leaf11',
              title: <b style={{ color: '#08c' }}>leaf11</b>,
            },
          ],
        },
      ],
    },
  ]

  return (
    <Space direction="vertical">
      <Text>
        Sites (Select Limit: {siteLimit}){' '}
        {isError ? (
          <>
            - <Text type="danger">Failed to fetch sites</Text>
          </>
        ) : null}
      </Text>

      <TreeSelect
        treeData={treeData}
        dropdownStyle={
          {
            // maxHeight: '300px', // maxHeight doesnt work and minHeight extends the 
            // height of the container but the values are still clipped. 
            // overflowY: 'auto', // Enforce scrolling
          }
        }
        className={css`
          width: 350px;
          overflow: auto; //Initially set to 'scroll' which fails
        `}
        placeholder="Type or select a site..."
        value={query.sites as string[]}
        onChange={handleOnChange}
        allowClear
        showSearch
        multiple
        loading={isLoading}
        data-testid="sites-filter"
        treeCheckable
        showCheckedStrategy="SHOW_PARENT"
        treeDefaultExpandedKeys={defaultExpandedKeys}
        treeNodeFilterProp="title"
        status={isError ? 'error' : undefined}
      />

      <Text type="secondary">Which stores should be included?</Text>
    </Space>
  )
}

问题现象 #

• 截图展示：
• 具体表现：如截图所示，parent 1-1及其子节点被截断无法完整显示。

已尝试的解决方法 #

• 调整height、maxHeight、minHeight等容器高度属性
• 修改overflow相关属性，包括设置overflow: auto、overflow: scroll
  但以上操作均未解决问题。

请问该问题的原因是什么？

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