Feature: 产品列表增加页头 & Markdown渲染器增加图像Url转换功能
This commit is contained in:
@ -20,16 +20,16 @@
|
||||
<NuxtLinkLocale to="/">{{ $t('navigation.home') }}</NuxtLinkLocale>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/productions')">{{ $t('productions') }}</NuxtLink>
|
||||
<NuxtLink :to="$localePath('/productions')">{{ $t('navigation.productions') }}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/solutions')">{{ $t('solutions') }}</NuxtLink>
|
||||
<NuxtLink :to="$localePath('/solutions')">{{ $t('navigation.solutions') }}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/support')">{{ $t('support') }}</NuxtLink>
|
||||
<NuxtLink :to="$localePath('/support')">{{ $t('navigation.support') }}</NuxtLink>
|
||||
</li>
|
||||
<li>
|
||||
<NuxtLink :to="$localePath('/about')">{{ $t('about-us') }}</NuxtLink>
|
||||
<NuxtLink :to="$localePath('/about')">{{ $t('navigation.about-us') }}</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -10,16 +10,16 @@
|
||||
<!-- 导航菜单 -->
|
||||
<el-menu default-active="productions" class="header-menu" mode="horizontal" :ellipsis="false" router>
|
||||
<el-menu-item :index="$localePath('/productions')">
|
||||
<span class="title">{{ $t('productions') }}</span>
|
||||
<span class="title">{{ $t('navigation.productions') }}</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item :index="$localePath('/solutions')">
|
||||
<span class="title">{{ $t('solutions') }}</span>
|
||||
<span class="title">{{ $t('navigation.solutions') }}</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item :index="$localePath('/support')">
|
||||
<span class="title">{{ $t('support') }}</span>
|
||||
<span class="title">{{ $t('navigation.support') }}</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item :index="$localePath('/about')">
|
||||
<span class="title">{{ $t('about-us') }}</span>
|
||||
<span class="title">{{ $t('navigation.about-us') }}</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
|
||||
|
||||
@ -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>
|
||||
Reference in New Issue
Block a user