使用bubble.list, 当messageRender是使用markdown时， 有时会导致滚动轴输出不贴底

[heavenlyfate]

markdown例如：

AAA \n

a\n
a\n
当模型输出输出比较快时，会导致滚动轴不贴底滚动

x/packages/x/components/bubble/BubbleList.tsx

Line 122 in 8f60c7a

target.scrollHeight - Math.abs(target.scrollTop) - target.clientHeight <= TOLERANCE,

[dosubot]

出现 markdown（尤其包含图片或异步内容）时，bubble.list 的滚动条有时不会自动贴底，原因是 scroll-to-bottom 逻辑只会在消息数据或内容同步更新时触发，但图片等异步资源加载后高度变化不会自动触发滚动更新。这导致内容变高后滚动条未能及时跟随到底部 [源码分析]。

常见的解决方法有：

• 在 markdown 内容中图片等异步资源加载完成时，手动触发滚动到底部（如监听 image 的 onLoad 事件后调用 scrollToBottom）。
• 或者用 MutationObserver 监听内容区域的 DOM 变化，变化后自动滚动到底部。
• 也可以用原生 JS 直接设置 scrollTop = scrollHeight 保证滚动条贴底 [相关讨论]。

官方 demo 目前没有处理异步内容导致的滚动问题，2.0 版本有较大升级，但 changelog 暂未明确修复此场景 [PR 说明]。

建议：如需兼容图片等异步内容，推荐在图片 onLoad 或内容变动后主动触发滚动到底部。

To reply, just mention @dosu.

---

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

[heavenlyfate]

出现 markdown（尤其包含图片或异步内容）时，bubble.list 的滚动条有时不会自动贴底，原因是 scroll-to-bottom 逻辑只会在消息数据或内容同步更新时触发，但图片等异步资源加载后高度变化不会自动触发滚动更新。这导致内容变高后滚动条未能及时跟随到底部 [源码分析]。

常见的解决方法有：

• 在 markdown 内容中图片等异步资源加载完成时，手动触发滚动到底部（如监听 image 的 onLoad 事件后调用 scrollToBottom）。
• 或者用 MutationObserver 监听内容区域的 DOM 变化，变化后自动滚动到底部。
• 也可以用原生 JS 直接设置 scrollTop = scrollHeight 保证滚动条贴底 [相关讨论]。

官方 demo 目前没有处理异步内容导致的滚动问题，2.0 版本有较大升级，但 changelog 暂未明确修复此场景 [PR 说明]。

建议：如需兼容图片等异步内容，推荐在图片 onLoad 或内容变动后主动触发滚动到底部。

To reply, just mention @dosu.

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

我使用时markdown中没有图片
举个模型输出markdown格式例子：

### 标题标
**  \n
- ** aa

这段会渲染为 h3 和 ul 标签,在 ul渲染过程中会突然增加上边距，导致的不贴底输出，这个是测试出来的一种情况；
目前是makdown去掉了所有上边距，暂时无问题

[anxLiang]

1.x 版本中 Bubble.List 的滚动贴底行为是滞后的，因为该版本的自动滚动机制实现的原理是依靠 effect 来实现的，这种机制在面对高速变化时工作不理想。
整体的机制优化在 2.0 版本中实现，可以考虑迁移到 2.0 版本来解决自动滚动的问题。

[heavenlyfate]

1.x 版本中 Bubble.List 的滚动贴底行为是滞后的，因为该版本的自动滚动机制实现的原理是依靠 effect 来实现的，这种机制在面对高速变化时工作不理想。 整体的机制优化在 2.0 版本中实现，可以考虑迁移到 2.0 版本来解决自动滚动的问题。

感谢回复，等待2.0版本

[yuguaa]

说一下我自己的实现方式吧，框架无关

如图：布局为滚动容器下面包含消息列表和占位容器
可滚动容器设置flex-column-reverse，占位容器设置flex:1来占据页面空白区域，滚动到底用占位容器来检测