🧐[问题]ProForm中设置grid 后， 在ProFormList里的组件设置colProps会不生效

[zwd609258057]

提问前先看看：

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🧐 问题描述

💻 示例代码

<ProForm name="generalRule" layout="horizontal" submitter={false} grid rowProps={{ gutter: [16, 8] }} > <ProFormList name={name} copyIconProps={false} colProps={{ span: 24 }}> <ProFormSelect colProps={{ span: 12 }} /> <ProFormSelect colProps={{ span: 12}} /> </ProFormList> </ProForm> 其中ProFormList中ProFormSelect的colProps会无效，原因是ant-pro-form-list-container并不是一个有效的ant-row，需要把ant-pro-form-list-container设为flex布局 目前有两个解决方案： <ProFormList itemContainerRender={(dom) => [<Row key="row" gutter={[8, 8]} style={{ marginBottom: 8 }}>{dom}</Row>]} /> 或者 <ProFormList containerClassName="ant-row" />

请问还有更好的方案吗？

[JLUssh]

你好， 我目前还没完全解决这个问题，和你遇到的情况可能一致！由于proformlist不遵循正常shange布局，导致会出现 X 轴滚动条 😥

<ProForm
  grid
  rowProps={{
    gutter: [8, 8],
  }}
>
  <ProCard bordered>
    <ProFormList
      name="pojoCustom"
      style={{
        width: '100%',
        boxSizing: 'border-box', // 避免 padding/border 撑大容器
        overflowX: 'hidden', // 尝试隐藏水平滚动条
      }}
    >
      <ProFormText
        name={'key'}
        label={NearlineHeaderInfo.key1}
        placeholder={`请输入${NearlineHeaderInfo.key1}`}
        style={{ width: '100%' }} // 输入框自适应父容器宽度
        rules={[
          {
            required: true,
            message: '请输入键',
            type: 'string',
            whitespace: true,
          },
        ]}
      />
      <ProFormText
        name={'value'}
        label={NearlineHeaderInfo.key2}
        placeholder={`请输入${NearlineHeaderInfo.key2}`}
        style={{ width: '100%' }} // 输入框自适应父容器宽度
        rules={[
          {
            required: true,
            message: '请输入值',
            type: 'string',
            whitespace: true,
          },
        ]}
      />
    </ProFormList>
  </ProCard>
</ProForm>

滚动条的实际效果如下：

想确认下你那边也是这种“即使设置了宽度和溢出隐藏，依然会出现X轴滚动条”的情况吗？有没有找到其他可行的解决办法呀？