From 39eea996b610e3b1eaf0b174d214a05a9b460cc3 Mon Sep 17 00:00:00 2001
From: Linzp <sunandmoon001@163.com>
Date: Tue, 17 Mar 2026 11:32:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=A2=84=E8=A7=88=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lib/init-libs-example.js |  0
 lib/init-module.js       |  0
 package.json             |  2 +-
 src/ExamplePage.js       | 12 +++++++-----
 src/Highlight.js         | 18 +++++++++++++++++-
 src/example.module.scss  |  9 +++++++++
 6 files changed, 34 insertions(+), 7 deletions(-)
 mode change 100644 => 100755 lib/init-libs-example.js
 mode change 100644 => 100755 lib/init-module.js

diff --git a/lib/init-libs-example.js b/lib/init-libs-example.js
old mode 100644
new mode 100755
diff --git a/lib/init-module.js b/lib/init-module.js
old mode 100644
new mode 100755
diff --git a/package.json b/package.json
index 56090bb..a7fcf2a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@kne/modules-dev",
-  "version": "2.1.18",
+  "version": "2.1.19",
   "description": "用于辅助在项目内启动一个规范化组件开发的环境",
   "publishConfig": {
     "access": "public",
diff --git a/src/ExamplePage.js b/src/ExamplePage.js
index 16f10fc..a9d12d9 100644
--- a/src/ExamplePage.js
+++ b/src/ExamplePage.js
@@ -5,7 +5,7 @@ import {Space} from "antd";
 import style from "./example.module.scss";
 import classnames from "classnames";
 import ExampleDriver from "@kne/example-driver";
-import {HashRouter} from "react-router-dom";
+import {MemoryRouter} from "react-router-dom";
 import {createWithRemoteLoader} from '@kne/remote-loader';
 import Highlight from './Highlight';
 
@@ -13,9 +13,9 @@ const ExampleDriverContext = createWithRemoteLoader({
     modules: ["components-core:Global@GlobalProvider"]
 })(({remoteModules, children, ...props}) => {
     const [GlobalProvider] = remoteModules;
-    return <HashRouter>
+    return <MemoryRouter>
         <GlobalProvider {...props}>{children}</GlobalProvider>
-    </HashRouter>
+    </MemoryRouter>
 });
 
 export const ExampleContent = createWithRemoteLoader({
@@ -64,8 +64,10 @@ export const ExampleContent = createWithRemoteLoader({
                                list={data.example.list}/>
             </div>
         </>}
-        <h2 className={style['part-title']}>API</h2>
-        <Highlight className="mark-down-html" html={data.api}/>
+        {data.api && <>
+            <h2 className={style['part-title']}>API</h2>
+            <Highlight className="mark-down-html" html={data.api}/>
+        </>}
     </Space>
 });
 
diff --git a/src/Highlight.js b/src/Highlight.js
index 7be52b4..9366bcf 100644
--- a/src/Highlight.js
+++ b/src/Highlight.js
@@ -11,8 +11,24 @@ const Highlight = ({html, ...props}) => {
         ref.current.querySelectorAll('pre code').forEach((el) => {
             hljs.highlightElement(el);
         });
+
     }, [html]);
-    return <div {...props} ref={ref} dangerouslySetInnerHTML={{__html: html}}/>
+
+    // 给所有 table 元素外面包裹一层 div
+    const wrapTableElements = (htmlString) => {
+        const tempDiv = document.createElement('div');
+        tempDiv.innerHTML = htmlString;
+        const tables = tempDiv.querySelectorAll('table');
+        tables.forEach(table => {
+            const wrapper = document.createElement('div');
+            wrapper.className = 'table-content';
+            table.parentNode.insertBefore(wrapper, table);
+            wrapper.appendChild(table);
+        });
+        return tempDiv.innerHTML;
+    };
+
+    return <div {...props} ref={ref} dangerouslySetInnerHTML={{__html: wrapTableElements(html)}}/>
 };
 
 export default Highlight;
\ No newline at end of file
diff --git a/src/example.module.scss b/src/example.module.scss
index c89646c..2081d5e 100644
--- a/src/example.module.scss
+++ b/src/example.module.scss
@@ -1,7 +1,16 @@
 .main {
   :global(.mark-down-html) {
+    overflow-x: auto;
+    width: 100%;
+
+    :global(.table-content) {
+      overflow-x: auto;
+      width: 100%;
+    }
+
     table {
       width: 100%;
+      min-width: 600px;
       margin: 8px 0 16px;
       empty-cells: show;
       border: 1px solid #ebedf0;