Conversations组件label超长的情况下菜单按钮会被遮挡

[FirenzeSida]

当前行为

Conversations组件在每次渲染一条新的items的时候如果label的文字超出显示长度，组件在计算显示部分文字的时候没有把菜单按钮计算进去，导致按钮被挤到显示区外了。

需要改变组件的宽度，触发组件重新渲染才会恢复正常显示

我发现是我给Conversations的加了overflow样式导致的

const style={
  widthSpace: 'nowrap',
  overflow: 'hidden'
}
return <Conversations style={style}></Conversations>

但是我加这个样式的初衷是为了做收缩菜单效果时，菜单不会横向滚动

预期行为

Conversations组件是否可以推出一个收缩模式

版本

1.0.5

[petercat-assistant]

感谢您提供详细的信息。根据您的描述，Conversations组件在label文字超出显示长度时，菜单按钮被遮挡的问题似乎是由于组件在计算显示部分文字时没有考虑到菜单按钮的宽度。

为了解决这个问题，您可以尝试以下方法：

1. CSS调整: 确保组件的CSS样式中为label和菜单按钮预留足够的空间。可以通过设置max-width或者overflow属性来限制label的宽度，从而避免菜单按钮被遮挡。

2. 组件重渲染: 如您所述，改变组件的宽度可以触发重新渲染并恢复正常显示。您可以在组件的生命周期方法中加入逻辑，自动调整组件宽度以触发重渲染。

3. 代码修改: 如果您有权限修改组件的源码，可以在组件的渲染逻辑中加入对菜单按钮的宽度计算，确保在显示label时预留足够的空间。

如果这些方法无法解决问题，建议您提供一个在线示例链接，以便更详细地分析问题。

🪧 Tips

For further assistance, please describe your question in the comments and @petercat-assistant to start a conversation with me.