pro-components icon indicating copy to clipboard operation
pro-components copied to clipboard

🐛[BUG]ProDescriptions的column,如果带ellipsis: true则会不支持valueEnum

Open Yuiffy opened this issue 2 years ago • 2 comments

提问前先看看:

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

🐛 bug 描述

ProDescriptions使用columns来传入结构,当某个column item的ellipsis为true,则它的valueEnum会失效,只展示原数据而不会展示Enum中设置的内容。

📷 复现步骤

sandbox:链接

不带ellipsis(正常): image

带ellipsis(导致valueEnum失效): image

🏞 期望结果

💻 复现代码

© 版本信息

  • ProComponents 版本: 2.6.42
  • umi 版本
  • 浏览器环境
  • 开发环境 [e.g. mac OS]

🚑 其他信息

Yuiffy avatar Nov 29 '23 07:11 Yuiffy

ellipsis 为 true 返回的就是一个 dom 了,这是个 bug

chenshuai2144 avatar Dec 28 '23 09:12 chenshuai2144

export const genCopyable = (dom: React.ReactNode, item: any, text: string) => {
  // 这里能不能加一个判断,只有 item.valueType === 'text' 才省略,其它类型的组件要省略自己写个样式?
  if (item.copyable || item.ellipsis) {
    const copyable =
      item.copyable && text
        ? {
            text,
            tooltips: ['', ''],
          }
        : undefined;

    /** 有些 valueType 需要设置copy的为string */
    const needTranText = isNeedTranText(item);

    const ellipsis =
      getEllipsis(item) && text
        ? {
            tooltip:
              // 支持一下 tooltip 的关闭
              item?.tooltip !== false && needTranText ? (
                <div className="pro-table-tooltip-text">{dom}</div>
              ) : (
                text
              ),
          }
        : false;
    return (
      <Typography.Text
        style={{
          width: '100%',
          margin: 0,
          padding: 0,
        }}
        title=""
        copyable={copyable}
        ellipsis={ellipsis}
      >
        {dom}
      </Typography.Text>
    );
  }
  return dom;
};

lossercode avatar May 31 '24 13:05 lossercode