refactor: article iconPath

src/components/Article.tsx

@@ -1,12 +1,14 @@
-import { Component, createSignal, createEffect, onCleanup, Show, createResource } from 'solid-js';
+import { Component, createSignal, createEffect, onCleanup, Show, createResource, createMemo } from 'solid-js';
 import { parseMarkdown } from '../markdown';
 import { extractSection } from '../data-loader';
 import mermaid from 'mermaid';
 import {getIndexedData} from "../data-loader/file-index";
+import { resolvePath } from './utils/path';
 
 export interface ArticleProps {
   src: string;
   section?: string;  // 指定要显示的标题（不含 #）
+  iconPath?: string;  // 图标路径前缀，默认为 "./assets"，空字符串表示禁用
   onLoaded?: () => void;
   onError?: (error: Error) => void;
   class?: string;  // 额外的 class 用于样式控制
@@ -28,6 +30,12 @@ export const Article: Component<ArticleProps> = (props) => {
     fetchArticleContent
   );
 
+  // 解析 iconPath，默认为 "./assets"，空字符串表示禁用
+  const iconPrefix = createMemo(() => {
+    if (props.iconPath === '') return undefined;  // 空字符串禁用图标前缀
+    return resolvePath(props.src, props.iconPath ?? "./assets");
+  });
+
   createEffect(() => {
     const data = content();
     if (data) {
@@ -50,7 +58,7 @@ export const Article: Component<ArticleProps> = (props) => {
         <div class="text-red-500">加载失败：{content.error?.message}</div>
       </Show>
       <Show when={!content.loading && !content.error && content()}>
-        <div class="relative" innerHTML={parseMarkdown(content()!)} />
+        <div class="relative" innerHTML={parseMarkdown(content()!, iconPrefix())} />
       </Show>
     </article>
   );