Skip to content

使用Ellipsis组件,当content内容有许多表情符号时,展开收起功能失效 #3406

@wangmeng6844

Description

@wangmeng6844

NutUI React 包名

@nutui/nutui-react-taro

NutUI React 版本号

3.0.13

平台

h5

重现链接

https://codesandbox.io/p/sandbox/nutui-react-2x-demo-fg4vxd?file=%2Fsrc%2FApp.tsx%3A8%2C11

重现步骤

使用Ellipsis
组件遇到了两个场景的问题,以下两种情况该如何解决
1、当content内容有许多表情时,超过4行展开收起功能失效,并未收起
具体的代码:
Ellipsis className={styles.itemEllipsis} content={item.commentContent} rows={4} expandText="展开" collapseText="收起" symbol=" "/>
数据源:'这块内容既有文字也有表情,测试超多表情展开收起是否会生效。一起期待一下,五星好评⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐
'
2、同样有许多表情符号,设置超过4行,展开收起的功能并未超过4行有收起状态
[图片]
具体的demo代码:
Ellipsis className={styles.itemEllipsis} content={item.commentContent} rows={4} expandText="展开" collapseText="收起" symbol=" "/>
数据源:'一如既往的好,张阿姨真棒👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻👏🏻'

期望的结果是什么?

当有文字有表情,都可以根据指定行数展开收起

实际的结果是什么?

当有文字有表情,根据指定行数未展示【展开】、【收起】

环境信息

No response

其他补充信息

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions