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

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions