fix: 修复流式生成时页面抖动
This commit is contained in:
parent
de79c227e2
commit
9fb32f1074
|
|
@ -189,8 +189,13 @@ function scrollToBottom(smooth = true) {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 流式时使用 instant 滚动,避免 smooth 动画与内容增长互相打架造成抖动
|
||||||
watch([() => props.messages.length, () => props.streamingContent], () => {
|
watch([() => props.messages.length, () => props.streamingContent], () => {
|
||||||
scrollToBottom()
|
nextTick(() => {
|
||||||
|
const el = scrollContainer.value
|
||||||
|
if (!el) return
|
||||||
|
el.scrollTo({ top: el.scrollHeight, behavior: props.streaming ? 'instant' : 'smooth' })
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(() => props.conversation?.id, () => {
|
watch(() => props.conversation?.id, () => {
|
||||||
|
|
|
||||||
|
|
@ -411,6 +411,7 @@ watch(() => props.streamingContent?.length, () => {
|
||||||
line-height: 1.7;
|
line-height: 1.7;
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
|
contain: layout style;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-content :deep(.placeholder) {
|
.text-content :deep(.placeholder) {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue