diff --git a/common/config/rush/pnpm-lock.yaml b/common/config/rush/pnpm-lock.yaml
index 62935e6c65..3f6a2332f1 100644
--- a/common/config/rush/pnpm-lock.yaml
+++ b/common/config/rush/pnpm-lock.yaml
@@ -1142,6 +1142,7 @@ importers:
       axios: ^1.4.0
       chai: 4.3.4
       cross-env: ^7.0.3
+      element-plus: ^2.13.2
       eslint: ~8.18.0
       eslint-plugin-vue: ^9.26.0
       form-data: ~4.0.0
@@ -1172,6 +1173,7 @@ importers:
     dependencies:
       '@visactor/vtable': link:../vtable
       '@visactor/vutils': 1.0.21
+      element-plus: 2.13.6_jpgbbvvgtyfb7txcmxxwrjcocq
     devDependencies:
       '@arco-design/web-vue': 2.57.0_vue@3.5.27
       '@babel/core': 7.20.12
@@ -2762,6 +2764,11 @@ packages:
     dependencies:
       '@jridgewell/trace-mapping': 0.3.9
 
+  /@ctrl/tinycolor/4.2.0:
+    resolution: {integrity: sha512-kzyuwOAQnXJNLS9PSyrk0CWk35nWJW/zl/6KvnTBMFK65gm7U1/Z5BqjxeapjZCIhQcM/DsrEmcbRwDyXyXK4A==}
+    engines: {node: '>=14'}
+    dev: false
+
   /@electron/get/1.14.1:
     resolution: {integrity: sha512-BrZYyL/6m0ZXz/lDxy/nlVhQz+WF+iPS6qXolEU8atw7h6v1aYkjwJZ63m+bJMBTxDE66X+r2tPS4a/8C82sZw==}
     engines: {node: '>=8.6'}
@@ -2780,6 +2787,14 @@ packages:
       - supports-color
     dev: true
 
+  /@element-plus/icons-vue/2.3.2_vue@3.5.27:
+    resolution: {integrity: sha512-OzIuTaIfC8QXEPmJvB4Y4kw34rSXdCJzxcD1kFStBvr8bK6X1zQAYDo0CNMjojnfTqRQCJ0I7prlErcoRiET2A==}
+    peerDependencies:
+      vue: ^3.2.0
+    dependencies:
+      vue: 3.5.27_typescript@4.9.5
+    dev: false
+
   /@esbuild/android-arm/0.15.18:
     resolution: {integrity: sha512-5GT+kcs2WVGjVs7+boataCkO5Fg0y4kCjzkB5bAip7H4jfnOS3dA6KPiww9W1OEKTKeAcUVhdZGvgI65OXmUnw==}
     engines: {node: '>=12'}
@@ -2846,6 +2861,23 @@ packages:
       lodash.uniq: 4.5.0
     dev: false
 
+  /@floating-ui/core/1.7.5:
+    resolution: {integrity: sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==}
+    dependencies:
+      '@floating-ui/utils': 0.2.11
+    dev: false
+
+  /@floating-ui/dom/1.7.6:
+    resolution: {integrity: sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==}
+    dependencies:
+      '@floating-ui/core': 1.7.5
+      '@floating-ui/utils': 0.2.11
+    dev: false
+
+  /@floating-ui/utils/0.2.11:
+    resolution: {integrity: sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==}
+    dev: false
+
   /@gulp-sourcemaps/identity-map/2.0.1:
     resolution: {integrity: sha512-Tb+nSISZku+eQ4X1lAkevcQa+jknn/OVUgZ3XCxEKIsLsqYuPoJwJOPQeaOk75X3WPftb29GWY1eqE7GLsXb1Q==}
     engines: {node: '>= 0.10'}
@@ -3695,6 +3727,10 @@ packages:
       '@sinonjs/commons': 1.8.6
     dev: true
 
+  /@sxzz/popperjs-es/2.11.8:
+    resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==}
+    dev: false
+
   /@szmarczak/http-timer/1.1.2:
     resolution: {integrity: sha512-XIB2XbzHTN6ieIjfIMV9hlVcfPU26s2vafYWQcZHWXHOxiaRZYEDKEwdl129Zyg50+foYV2jCgtrqSA6qNuNSA==}
     engines: {node: '>=6'}
@@ -3950,9 +3986,18 @@ packages:
     resolution: {integrity: sha512-yg6E+u0/+Zjva+buc3EIb+29XEg4wltq7cSmd4Uc2EE/1nUVmxyzpX6gUXD0V8jIrG0r7YeOGVIbYRkxeooCtw==}
     dev: true
 
+  /@types/lodash-es/4.17.12:
+    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
+    dependencies:
+      '@types/lodash': 4.14.182
+    dev: false
+
   /@types/lodash/4.14.182:
     resolution: {integrity: sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==}
-    dev: true
+
+  /@types/lodash/4.17.24:
+    resolution: {integrity: sha512-gIW7lQLZbue7lRSWEFql49QJJWThrTFFeIMJdp3eH4tKoxm1OvEPg02rm4wCCSHS0cL3/Fizimb35b7k8atwsQ==}
+    dev: false
 
   /@types/markdown-it/13.0.9:
     resolution: {integrity: sha512-1XPwR0+MgXLWfTn9gCsZ55AHOKW1WN+P9vr0PaQh5aerR9LLQXUbjfEAFhjmEmyoYFWAyuN2Mqkn40MZ4ukjBw==}
@@ -4134,6 +4179,10 @@ packages:
       '@types/expect': 1.20.4
       '@types/node': 25.0.10
 
+  /@types/web-bluetooth/0.0.20:
+    resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
+    dev: false
+
   /@types/yargs-parser/21.0.0:
     resolution: {integrity: sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==}
     dev: true
@@ -4553,6 +4602,29 @@ packages:
   /@vue/shared/3.5.27:
     resolution: {integrity: sha512-dXr/3CgqXsJkZ0n9F3I4elY8wM9jMJpP3pvRG52r6m0tu/MsAFIe6JpXVGeNMd/D9F4hQynWT8Rfuj0bdm9kFQ==}
 
+  /@vueuse/core/12.0.0_typescript@4.9.5:
+    resolution: {integrity: sha512-C12RukhXiJCbx4MGhjmd/gH52TjJsc3G0E0kQj/kb19H3Nt6n1CA4DRWuTdWWcaFRdlTe0npWDS942mvacvNBw==}
+    dependencies:
+      '@types/web-bluetooth': 0.0.20
+      '@vueuse/metadata': 12.0.0
+      '@vueuse/shared': 12.0.0_typescript@4.9.5
+      vue: 3.5.27_typescript@4.9.5
+    transitivePeerDependencies:
+      - typescript
+    dev: false
+
+  /@vueuse/metadata/12.0.0:
+    resolution: {integrity: sha512-Yzimd1D3sjxTDOlF05HekU5aSGdKjxhuhRFHA7gDWLn57PRbBIh+SF5NmjhJ0WRgF3my7T8LBucyxdFJjIfRJQ==}
+    dev: false
+
+  /@vueuse/shared/12.0.0_typescript@4.9.5:
+    resolution: {integrity: sha512-3i6qtcq2PIio5i/vVYidkkcgvmTjCqrf26u+Fd4LhnbBmIT6FN8y6q/GJERp8lfcB9zVEfjdV0Br0443qZuJpw==}
+    dependencies:
+      vue: 3.5.27_typescript@4.9.5
+    transitivePeerDependencies:
+      - typescript
+    dev: false
+
   /abab/2.0.6:
     resolution: {integrity: sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==}
     deprecated: Use your platform's native atob() and btoa() methods instead
@@ -5051,6 +5123,10 @@ packages:
       async-done: 1.3.2
     dev: false
 
+  /async-validator/4.2.5:
+    resolution: {integrity: sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==}
+    dev: false
+
   /async/3.2.6:
     resolution: {integrity: sha512-htCUDlxyyCLMgaM3xXg0C0LW2xqfuQ6p05pCEIsXuyQ+a1koYKTuBMzRNwmybfLgvJDMd0r1LTn4+E0Ti6C2AA==}
     dev: false
@@ -5358,6 +5434,7 @@ packages:
 
   /bindings/1.5.0:
     resolution: {integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
+    requiresBuild: true
     dependencies:
       file-uri-to-path: 1.0.0
     optional: true
@@ -6696,6 +6773,31 @@ packages:
       - supports-color
     dev: true
 
+  /element-plus/2.13.6_jpgbbvvgtyfb7txcmxxwrjcocq:
+    resolution: {integrity: sha512-XHgwXr8Fjz6i+6BaqFhAbae/dJbG7bBAAlHrY3pWL7dpj+JcqcOyKYt4Oy5KP86FQwS1k4uIZDjCx2FyUR5lDg==}
+    peerDependencies:
+      vue: ^3.3.0
+    dependencies:
+      '@ctrl/tinycolor': 4.2.0
+      '@element-plus/icons-vue': 2.3.2_vue@3.5.27
+      '@floating-ui/dom': 1.7.6
+      '@popperjs/core': /@sxzz/popperjs-es/2.11.8
+      '@types/lodash': 4.17.24
+      '@types/lodash-es': 4.17.12
+      '@vueuse/core': 12.0.0_typescript@4.9.5
+      async-validator: 4.2.5
+      dayjs: 1.11.19
+      lodash: 4.17.23
+      lodash-es: 4.17.23
+      lodash-unified: 1.0.3_xtz7d4aqbrlvuaadc2twgswtwa
+      memoize-one: 6.0.0
+      normalize-wheel-es: 1.2.0
+      vue: 3.5.27_typescript@4.9.5
+      vue-component-type-helpers: 3.2.6
+    transitivePeerDependencies:
+      - typescript
+    dev: false
+
   /emittery/0.7.2:
     resolution: {integrity: sha512-A8OG5SR/ij3SsJdWDJdkkSYUjQdCUx6APQXem0SaEePBSRg4eymGYwBkKo1Y6DU+af/Jn2dBQqDBvjnr9Vi8nQ==}
     engines: {node: '>=10'}
@@ -7633,6 +7735,7 @@ packages:
 
   /file-uri-to-path/1.0.0:
     resolution: {integrity: sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==}
+    requiresBuild: true
     optional: true
 
   /fill-range/4.0.0:
@@ -10412,6 +10515,22 @@ packages:
       p-locate: 5.0.0
     dev: true
 
+  /lodash-es/4.17.23:
+    resolution: {integrity: sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==}
+    dev: false
+
+  /lodash-unified/1.0.3_xtz7d4aqbrlvuaadc2twgswtwa:
+    resolution: {integrity: sha512-WK9qSozxXOD7ZJQlpSqOT+om2ZfcT4yO+03FuzAHD0wF6S0l0090LRPDx3vhTTLZ8cFKpBn+IOcVXK6qOcIlfQ==}
+    peerDependencies:
+      '@types/lodash-es': '*'
+      lodash: '*'
+      lodash-es: '*'
+    dependencies:
+      '@types/lodash-es': 4.17.12
+      lodash: 4.17.23
+      lodash-es: 4.17.23
+    dev: false
+
   /lodash.camelcase/4.3.0:
     resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==}
     dev: false
@@ -10486,6 +10605,10 @@ packages:
   /lodash/4.17.21:
     resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
 
+  /lodash/4.17.23:
+    resolution: {integrity: sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==}
+    dev: false
+
   /log-symbols/4.1.0:
     resolution: {integrity: sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==}
     engines: {node: '>=10'}
@@ -10679,6 +10802,10 @@ packages:
   /mdurl/1.0.1:
     resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
 
+  /memoize-one/6.0.0:
+    resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==}
+    dev: false
+
   /memoizee/0.4.17:
     resolution: {integrity: sha512-DGqD7Hjpi/1or4F/aYAspXKNm5Yili0QDAFAY4QYvpqpgiY6+1jOfqpmByzjxbWd/T9mChbCArXAbDAsTm5oXA==}
     engines: {node: '>=0.12'}
@@ -10866,6 +10993,7 @@ packages:
 
   /nan/2.24.0:
     resolution: {integrity: sha512-Vpf9qnVW1RaDkoNKFUvfxqAbtI8ncb8OJlqZ9wwpXzWPEsvsB1nvdUi6oYrHIkQ1Y/tMDnr1h4nczS0VB9Xykg==}
+    requiresBuild: true
     optional: true
 
   /nanoid/3.1.25:
@@ -10981,6 +11109,10 @@ packages:
     engines: {node: '>=10'}
     dev: false
 
+  /normalize-wheel-es/1.2.0:
+    resolution: {integrity: sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==}
+    dev: false
+
   /now-and-later/2.0.1:
     resolution: {integrity: sha512-KGvQ0cB70AQfg107Xvs/Fbu+dGmZoTRJp2TaPwcwQm3/7PteUyN2BCgk8KBMPGBUXZdVwyWS8fDCGFygBm19UQ==}
     engines: {node: '>= 0.10'}
@@ -14702,6 +14834,10 @@ packages:
       - terser
     dev: true
 
+  /vue-component-type-helpers/3.2.6:
+    resolution: {integrity: sha512-O02tnvIfOQVmnvoWwuSydwRoHjZVt8UEBR+2p4rT35p8GAy5VTlWP8o5qXfJR/GWCN0nVZoYWsVUvx2jwgdBmQ==}
+    dev: false
+
   /vue-eslint-parser/9.4.3_eslint@8.18.0:
     resolution: {integrity: sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==}
     engines: {node: ^14.17.0 || >=16.0.0}
diff --git a/docs/assets/demo-vue/menu.json b/docs/assets/demo-vue/menu.json
index 51b7d07207..37aadafe5d 100644
--- a/docs/assets/demo-vue/menu.json
+++ b/docs/assets/demo-vue/menu.json
@@ -112,6 +112,13 @@
             "en": "cell dom component"
           }
         },
+        {
+          "path": "cell-vnode-component",
+          "title": {
+            "zh": "vnode绑定elplus组件",
+            "en": "cell vnode component"
+          }
+        },
         {
           "path": "cell-custom-reactive-layout",
           "title": {
diff --git a/docs/assets/demo-vue/zh/custom-layout/cell-vnode-component.md b/docs/assets/demo-vue/zh/custom-layout/cell-vnode-component.md
new file mode 100644
index 0000000000..70b69b09c9
--- /dev/null
+++ b/docs/assets/demo-vue/zh/custom-layout/cell-vnode-component.md
@@ -0,0 +1,172 @@
+---
+category: examples
+group: custom-layout
+title: Vnode绑定elplus组件
+cover:
+order: 1-3
+---
+
+# 单元vnode绑定ElInput组件示例
+
+单元格中通过Vnode绑定ElInput组件示例
+
+## 代码演示
+
+```javascript livedemo template=vtable-vue
+<template>
+  <vue-list-table :options="tableOptions" />
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, h, createVNode, render, nextTick } from 'vue';
+import { ElPopover, ElInput, ElTable, ElTableColumn } from 'element-plus';
+import { VTable } from '@visactor/vue-vtable';
+
+// 编辑值（单例共享，符合 VTable 编辑器机制）
+const inputValue = ref('');
+
+// 自定义编辑器：单价输入 + 历史价格悬浮弹窗
+class PriceInputEditor {
+  private container: HTMLElement | null = null;
+  private editorConfig: Record<string, any>;
+  private editorDom: HTMLElement | null = null;
+  private endEdit: (() => void) | null = null;
+
+  constructor(editorConfig: Record<string, any>) {
+    this.editorConfig = editorConfig;
+  }
+
+  // 开始编辑
+  async onStart({ container, referencePosition, value, endEdit }) {
+    this.container = container;
+    this.endEdit = endEdit;
+    inputValue.value = value ?? '';
+
+    // 历史价格列配置
+    const historyColumns = [
+      { prop: 'price', label: '历史单价', width: 80 },
+      { prop: 'date', label: '更新时间', width: 130 }
+    ];
+
+    // 历史价格数据
+    const historyData = [
+      { price: 2.41, date: '2026-03-27' },
+      { price: 5.67, date: '2026-03-28' }
+    ];
+
+    // 渲染编辑器：输入框 + Popover 悬浮表格
+    const editorVNode = h(
+      'div',
+      {
+        id: 'price-editor',
+        style: {
+          position: 'absolute',
+          padding: '4px',
+          width: '100%',
+          boxSizing: 'border-box'
+        }
+      },
+      h(
+        ElPopover,
+        { placement: 'right', trigger: 'hover', width: 200 },
+        {
+          // 输入框
+          reference: () =>
+            createVNode(ElInput, {
+              modelValue: inputValue.value,
+              'onUpdate:modelValue': val => (inputValue.value = val),
+              type: 'number',
+              min: 0,
+              style: { width: '100%' }
+            }),
+
+          // 悬浮内容：历史价格表
+          default: () =>
+            h(ElTable, { width: '200px', data: historyData }, () => historyColumns.map(col => h(ElTableColumn, col)))
+        }
+      )
+    );
+
+    render(editorVNode, container);
+
+    // 渲染完成后定位
+    await nextTick();
+    this.editorDom = document.getElementById('price-editor');
+    if (referencePosition?.rect && this.editorDom) {
+      this.adjustPosition(referencePosition.rect);
+    }
+  }
+
+  // 自适应单元格位置
+  adjustPosition(rect: DOMRect) {
+    if (!this.editorDom) {
+      return;
+    }
+    this.editorDom.style.top = `${rect.top}px`;
+    this.editorDom.style.left = `${rect.left}px`;
+    this.editorDom.style.width = `${rect.width}px`;
+    this.editorDom.style.height = `${rect.height}px`;
+  }
+
+  // 获取最终值
+  getValue() {
+    return inputValue.value?.toString() || '';
+  }
+
+  // 销毁编辑器
+  onEnd() {
+    if (this.container) {
+      render(null, this.container);
+    }
+    this.container = null;
+    this.endEdit = null;
+    this.editorDom = null;
+  }
+
+  // 判断点击是否在编辑器内
+  isEditorElement(target: HTMLElement) {
+    return this.editorDom?.contains(target);
+  }
+}
+
+// 注册编辑器
+const priceEditor = new PriceInputEditor({});
+VTable.register.editor('price-editor', priceEditor);
+
+// 表格配置
+const tableOptions = ref({
+  columns: [
+    { field: 'Order ID', title: 'Order ID', width: 'auto' },
+    { field: 'Customer ID', title: 'Customer ID', width: 'auto' },
+    { field: 'Product Name', title: 'Product Name', width: 'auto' },
+    { field: 'Category', title: 'Category', width: 'auto' },
+    { field: 'Sub-Category', title: 'Sub-Category', width: 'auto' },
+    { field: 'Region', title: 'Region', width: 'auto' },
+    { field: 'City', title: 'City', width: 'auto' },
+    { field: 'Order Date', title: 'Order Date', width: 'auto' },
+    { field: 'Quantity', title: 'Quantity', width: 'auto' },
+    { field: 'Sales', title: 'Price', width: 'auto', editor: 'price-editor' },
+    { field: 'Profit', title: 'Profit', width: 'auto' }
+  ],
+  records: []
+});
+
+// 加载表格数据
+const loadTableData = async () => {
+  try {
+    const res = await fetch(
+      'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/North_American_Superstore_data.json'
+    );
+    const data = await res.json();
+    tableOptions.value.records = data;
+  } catch (err) {
+    console.error('数据加载失败：', err);
+  }
+};
+
+onMounted(async () => {
+  await loadTableData();
+});
+</script>
+
+```
diff --git a/packages/vue-vtable/demo/src/App.vue b/packages/vue-vtable/demo/src/App.vue
index a54581281b..772885ace0 100644
--- a/packages/vue-vtable/demo/src/App.vue
+++ b/packages/vue-vtable/demo/src/App.vue
@@ -29,6 +29,9 @@ import PivotChartPie from './table/gramatical/composition/PivotChartPie.vue';
 import singleTag from './table/single/single-tag.vue';
 import singleCheckbox from './table/single/single-checkbox.vue';
 import singleRadio from './table/single/single-radio.vue';
+
+// el-plus自定义组件表格示例
+import tableEditor from './table/elplus/index.vue';
 </script>
 
 <template>
@@ -50,7 +53,8 @@ import singleRadio from './table/single/single-radio.vue';
   <!-- gramatical -->
   <!-- ---------- -->
 
-  <ListTable />
+  <!-- <ListTable /> -->
+  <tableEditor />
   <!-- <ListTableEditor /> -->
   <!-- <ListTableEditorArco /> -->
   <!-- <ListTableEditorRender /> -->
diff --git a/packages/vue-vtable/demo/src/main.ts b/packages/vue-vtable/demo/src/main.ts
index 7155ab2ecf..9eead457f1 100644
--- a/packages/vue-vtable/demo/src/main.ts
+++ b/packages/vue-vtable/demo/src/main.ts
@@ -3,10 +3,13 @@ import App from './App.vue';
 import { ListTable, PivotTable, PivotChart } from '../../src/index';
 import ArcoVue from '@arco-design/web-vue';
 import '@arco-design/web-vue/dist/arco.css';
+import ElementPlus from 'element-plus';
+import 'element-plus/dist/index.css';
 // import './index.css';
 
 const app = createApp(App);
 app.use(ArcoVue);
+app.use(ElementPlus);
 app.component('VueListTable', ListTable);
 app.component('VuePivotTable', PivotTable);
 app.component('VuePivotChart', PivotChart);
diff --git a/packages/vue-vtable/demo/src/table/elplus/index.vue b/packages/vue-vtable/demo/src/table/elplus/index.vue
new file mode 100644
index 0000000000..ea8b600aab
--- /dev/null
+++ b/packages/vue-vtable/demo/src/table/elplus/index.vue
@@ -0,0 +1,155 @@
+<template>
+  <vue-list-table :options="tableOptions" />
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, h, createVNode, render, nextTick } from 'vue';
+import { ElPopover, ElInput, ElTable, ElTableColumn } from 'element-plus';
+import { VTable } from '@visactor/vue-vtable';
+
+// 编辑值（单例共享，符合 VTable 编辑器机制）
+const inputValue = ref('');
+
+// 自定义编辑器：单价输入 + 历史价格悬浮弹窗
+class PriceInputEditor {
+  private container: HTMLElement | null = null;
+  private editorConfig: Record<string, any>;
+  private editorDom: HTMLElement | null = null;
+  private endEdit: (() => void) | null = null;
+
+  constructor(editorConfig: Record<string, any>) {
+    this.editorConfig = editorConfig;
+  }
+
+  // 开始编辑
+  async onStart({ container, referencePosition, value, endEdit }) {
+    this.container = container;
+    this.endEdit = endEdit;
+    inputValue.value = value ?? '';
+
+    // 历史价格列配置
+    const historyColumns = [
+      { prop: 'price', label: '历史单价', width: 80 },
+      { prop: 'date', label: '更新时间', width: 130 }
+    ];
+
+    // 历史价格数据
+    const historyData = [
+      { price: 2.41, date: '2026-03-27' },
+      { price: 5.67, date: '2026-03-28' }
+    ];
+
+    // 渲染编辑器：输入框 + Popover 悬浮表格
+    const editorVNode = h(
+      'div',
+      {
+        id: 'price-editor',
+        style: {
+          position: 'absolute',
+          padding: '4px',
+          width: '100%',
+          boxSizing: 'border-box'
+        }
+      },
+      h(
+        ElPopover,
+        { placement: 'right', trigger: 'hover', width: 200 },
+        {
+          // 输入框
+          reference: () =>
+            createVNode(ElInput, {
+              modelValue: inputValue.value,
+              'onUpdate:modelValue': val => (inputValue.value = val),
+              type: 'number',
+              min: 0,
+              style: { width: '100%' }
+            }),
+
+          // 悬浮内容：历史价格表
+          default: () =>
+            h(ElTable, { width: '200px', data: historyData }, () => historyColumns.map(col => h(ElTableColumn, col)))
+        }
+      )
+    );
+
+    render(editorVNode, container);
+
+    // 渲染完成后定位
+    await nextTick();
+    this.editorDom = document.getElementById('price-editor');
+    if (referencePosition?.rect && this.editorDom) {
+      this.adjustPosition(referencePosition.rect);
+    }
+  }
+
+  // 自适应单元格位置
+  adjustPosition(rect: DOMRect) {
+    if (!this.editorDom) {
+      return;
+    }
+    this.editorDom.style.top = `${rect.top}px`;
+    this.editorDom.style.left = `${rect.left}px`;
+    this.editorDom.style.width = `${rect.width}px`;
+    this.editorDom.style.height = `${rect.height}px`;
+  }
+
+  // 获取最终值
+  getValue() {
+    return inputValue.value?.toString() || '';
+  }
+
+  // 销毁编辑器
+  onEnd() {
+    if (this.container) {
+      render(null, this.container);
+    }
+    this.container = null;
+    this.endEdit = null;
+    this.editorDom = null;
+  }
+
+  // 判断点击是否在编辑器内
+  isEditorElement(target: HTMLElement) {
+    return this.editorDom?.contains(target);
+  }
+}
+
+// 注册编辑器
+const priceEditor = new PriceInputEditor({});
+VTable.register.editor('price-editor', priceEditor);
+
+// 表格配置
+const tableOptions = ref({
+  columns: [
+    { field: 'Order ID', title: 'Order ID', width: 'auto' },
+    { field: 'Customer ID', title: 'Customer ID', width: 'auto' },
+    { field: 'Product Name', title: 'Product Name', width: 'auto' },
+    { field: 'Category', title: 'Category', width: 'auto' },
+    { field: 'Sub-Category', title: 'Sub-Category', width: 'auto' },
+    { field: 'Region', title: 'Region', width: 'auto' },
+    { field: 'City', title: 'City', width: 'auto' },
+    { field: 'Order Date', title: 'Order Date', width: 'auto' },
+    { field: 'Quantity', title: 'Quantity', width: 'auto' },
+    { field: 'Sales', title: 'Price', width: 'auto', editor: 'price-editor' },
+    { field: 'Profit', title: 'Profit', width: 'auto' }
+  ],
+  records: []
+});
+
+// 加载表格数据
+const loadTableData = async () => {
+  try {
+    const res = await fetch(
+      'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/North_American_Superstore_data.json'
+    );
+    const data = await res.json();
+    tableOptions.value.records = data;
+  } catch (err) {
+    console.error('数据加载失败：', err);
+  }
+};
+
+onMounted(async () => {
+  await loadTableData();
+});
+</script>
diff --git a/packages/vue-vtable/package.json b/packages/vue-vtable/package.json
index 0267260bb6..7b99c3c0ec 100644
--- a/packages/vue-vtable/package.json
+++ b/packages/vue-vtable/package.json
@@ -58,7 +58,8 @@
   },
   "dependencies": {
     "@visactor/vtable": "workspace:*",
-    "@visactor/vutils": "~1.0.17"
+    "@visactor/vutils": "~1.0.17",
+    "element-plus": "^2.13.2"
   },
   "devDependencies": {
     "@arco-design/web-vue": "^2.11.0",
@@ -105,5 +106,33 @@
     "axios": "^1.4.0",
     "eslint-plugin-vue": "^9.26.0",
     "vue-eslint-parser": "^9.4.2"
+  },
+  "pnpm": {
+    "allowedDeprecatedVersions": {
+      "are-we-there-yet": "*",
+      "sourcemap-codec": "*",
+      "lodash.isequal": "*",
+      "domexception": "*",
+      "w3c-hr-time": "*",
+      "inflight": "*",
+      "npmlog": "*",
+      "rimraf": "*",
+      "stable": "*",
+      "gauge": "*",
+      "abab": "*",
+      "glob": "*"
+    },
+    "onlyBuiltDependencies": [
+      "@parcel/watcher",
+      "core-js",
+      "es5-ext",
+      "esbuild",
+      "typeit",
+      "vue-demi"
+    ],
+    "ignoredBuiltDependencies": [
+      "@tailwindcss/oxide",
+      "vue3-danmaku"
+    ]
   }
-}
+}
\ No newline at end of file