perf: 优化markdown显示问题
This commit is contained in:
@@ -110,11 +110,6 @@ const renderer = {
|
||||
const titleAttr = title ? ` title="${title}"` : '';
|
||||
return `<img src="${href}" alt="${text}"${titleAttr} loading="lazy" class="markdown-image" />`;
|
||||
},
|
||||
|
||||
// 表格
|
||||
table(token: { header: string; body: string }) {
|
||||
return `<div class="table-wrapper"><table>${token.header}${token.body}</table></div>`;
|
||||
},
|
||||
};
|
||||
|
||||
marked.use({ renderer });
|
||||
@@ -149,7 +144,10 @@ async function renderContent(content: string) {
|
||||
lastContent = content;
|
||||
|
||||
try {
|
||||
const rawHtml = await marked.parse(content);
|
||||
let rawHtml = await marked.parse(content);
|
||||
// 包装表格,添加 table-wrapper 以支持横向滚动
|
||||
rawHtml = rawHtml.replace(/<table>/g, '<div class="table-wrapper"><table>');
|
||||
rawHtml = rawHtml.replace(/<\/table>/g, '</table></div>');
|
||||
// 使用 DOMPurify 清理 HTML,防止 XSS
|
||||
renderedHtml.value = DOMPurify.sanitize(rawHtml, {
|
||||
ADD_TAGS: ['iframe'],
|
||||
@@ -649,7 +647,7 @@ onUnmounted(() => {
|
||||
font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
|
||||
font-size: 14px;
|
||||
//line-height: 21px;
|
||||
height: 22.72px;
|
||||
height: 22px;
|
||||
min-width: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -202,13 +202,6 @@ function handleDataChunk(chunk: AnyObject) {
|
||||
latest.content += parsed.content;
|
||||
}
|
||||
}
|
||||
|
||||
// 流式输出时保持滚动条在底部(等待 DOM 更新后再滚动)
|
||||
nextTick(() => {
|
||||
requestAnimationFrame(() => {
|
||||
bubbleListRef.value?.scrollToBottom();
|
||||
});
|
||||
});
|
||||
}
|
||||
catch (err) {
|
||||
console.error('解析数据时出错:', err);
|
||||
@@ -1248,4 +1241,7 @@ onUnmounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer-time .el-button{
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user