Picker的columns中label文本超长时，如何不单行省略，做到自动换行，且adm-picker-view-mask-middle的height也跟随文本自动撑开？

[JintNiu]

      <Button
        onClick={() => {
          setVisible(true);
        }}
      >
        选择
      </Button>
    <Picker
      columns={[
        [
          {
            label:
              "周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一周一",
            value: "Mon",
          },
          { label: "周二", value: "Tues" },
          { label: "周三", value: "Wed" },
        ],
      ]}
      visible={visible}
      onClose={() => {
        setVisible(false);
      }}
    />

每行高度是根据--item-height样式设置的，但每个label的长度不同。不管是覆盖text-overflow等相关样式，还是设置--item-height为auto都不行

[dosubot[bot]]

Hi @JintNiu! I'm Dosu and I’m helping the ant-design-mobile team.

目前 Picker 的实现是通过 CSS 固定每项高度（--item-height），并且 label 默认样式强制单行省略（white-space: nowrap; text-overflow: ellipsis;），即使你覆盖这些样式或设置 --item-height: auto，也无法实现自动换行和高度自适应，因为组件内部布局和滚动逻辑都依赖于固定高度 源码1 源码2。

你可以尝试用 renderLabel 自定义 label 渲染（比如用 <div style={{whiteSpace: 'normal'}}> 包裹），但实际效果依然受限于 Picker 的内部高度和滚动计算，mask 区域（adm-picker-view-mask-middle）的高度也不会自动撑开，只能跟随 --item-height 变量 源码3。

社区和 issue 讨论也确认了这个限制，目前没有官方支持多行 label 和 mask 高度自适应的方案 相关讨论 相关讨论2。

如果你的业务场景必须支持多行 label 和高度自适应，建议考虑自定义 Picker 组件或用其他交互方式实现。现有 Picker 只能通过调整 --item-height 让所有项高度一致，无法根据内容动态调整。

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}