remilia/jinshen-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature: 产品列表增加页头 & Markdown渲染器增加图像Url转换功能

Browse Source
This commit is contained in:
R2m1liA
2025-08-21 14:26:58 +08:00
parent 0a31a1fa85
commit 2fe8797551
7 changed files with 86 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app/components/MarkdownRenderer.vue
View File

@ -1,7 +1,7 @@
<!-- eslint-disable vue/no-v-html -->
<template>
<!-- 用 v-html 渲染解析后的 HTML -->
<div class="markdown-body" v-html="safeHtml"/>
<div class="markdown-body" v-html="safeHtml" />
</template>
<script setup lang="ts">
@ -11,8 +11,12 @@ interface Props {
const props = defineProps<Props>()
const contentWithAbsoluteUrls = convertMedia(props.content)
// 将 Markdown 转换成 HTML
const safeHtml = computed(() => renderMarkdown(props.content))
const safeHtml = computed(() => renderMarkdown(contentWithAbsoluteUrls))
</script>
<style>
@ -23,13 +27,13 @@ const safeHtml = computed(() => renderMarkdown(props.content))
.markdown-body h1,
.markdown-body h2 {
color: var(--el-color-primary);
font-size: 1.5em;
margin-bottom: 0.5em;
color: var(--el-color-primary);
font-size: 1.5em;
margin-bottom: 0.5em;
}
.markdown-body ol {
list-style-type: decimal;
padding-left: 2em;
list-style-type: decimal;
padding-left: 2em;
}
</style>