diff --git a/docs/manual/advanced/custom-node.en.md b/docs/manual/advanced/custom-node.en.md
index 12e367f5f2..442c79abae 100644
--- a/docs/manual/advanced/custom-node.en.md
+++ b/docs/manual/advanced/custom-node.en.md
@@ -533,7 +533,7 @@ G6.registerNode('dom-node', {
         height: cfg.size[1],
         // DOM's html with onclick event
         html: `
-        <div onclick="handleClick('Hello')" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
+        <div onclick="alert('Hi')" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
           <div style="height: 100%; width: 33%; background-color: #CDDDFD">
             <img alt="" style="line-height: 100%; padding-top: 6px; padding-left: 8px;" src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q_FQT6nwEC8AAAAAAAAAAABkARQnAQ" width="20" height="20" />  
           </div>
@@ -545,7 +545,4 @@ G6.registerNode('dom-node', {
     });
   },
 }, 'single-node');
-const handleClick = msg => {
-  // ...
-}
 ```
\ No newline at end of file
diff --git a/docs/manual/advanced/custom-node.zh.md b/docs/manual/advanced/custom-node.zh.md
index 40b929576c..cd9c261589 100644
--- a/docs/manual/advanced/custom-node.zh.md
+++ b/docs/manual/advanced/custom-node.zh.md
@@ -529,7 +529,7 @@ G6.registerNode('dom-node', {
         height: cfg.size[1],
         // 传入 DOM 的 html，带有原生 onclick 事件
         html: `
-        <div onclick="handleClick('Hello')" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
+        <div onclick="alert('Hi')" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
           <div style="height: 100%; width: 33%; background-color: #CDDDFD">
             <img alt="" style="line-height: 100%; padding-top: 6px; padding-left: 8px;" src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q_FQT6nwEC8AAAAAAAAAAABkARQnAQ" width="20" height="20" />  
           </div>
@@ -541,7 +541,4 @@ G6.registerNode('dom-node', {
     });
   },
 }, 'single-node');
-const handleClick = msg => {
-  // ...
-}
 ```
\ No newline at end of file
diff --git a/examples/shape/customNode/demo/svgDom.js b/examples/shape/customNode/demo/svgDom.js
index 3ae541eaba..fa334aa0db 100644
--- a/examples/shape/customNode/demo/svgDom.js
+++ b/examples/shape/customNode/demo/svgDom.js
@@ -17,7 +17,7 @@ G6.registerNode('dom-node', {
         width: cfg.size[0],
         height: cfg.size[1],
         html: `
-        <div style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
+        <div onclick="alert('Hi')" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
           <div style="height: 100%; width: 33%; background-color: #CDDDFD">
             <img alt="" style="line-height: 100%; margin-left: 7px;" src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q_FQT6nwEC8AAAAAAAAAAABkARQnAQ" width="20" height="20" />  
           </div>
diff --git a/stories/Issues/component/dom-click.tsx b/stories/Issues/component/dom-click.tsx
new file mode 100644
index 0000000000..98f99ec895
--- /dev/null
+++ b/stories/Issues/component/dom-click.tsx
@@ -0,0 +1,87 @@
+import React, { useEffect } from 'react';
+import G6 from '../../../src';
+import { IGraph } from '../../../src/interface/graph';
+
+let graph: IGraph = null;
+
+
+function handleClick(msg) {
+  alert('aaa')
+}
+
+const DomClick = () => {
+  G6.registerNode('dom-node', {
+  draw: (cfg, group) => {
+    return group.addShape('dom', {
+      attrs: {
+        width: cfg.size[0],
+        height: cfg.size[1],
+        // 传入 DOM 的 html，带有原生 onclick 事件
+        html: `
+        <div onclick="console.log('a');alert('a');" style="background-color: #fff; border: 2px solid #5B8FF9; border-radius: 5px; width: ${cfg.size[0]-5}px; height: ${cfg.size[1]-5}px; display: flex;">
+          <div style="height: 100%; width: 33%; background-color: #CDDDFD">
+            <img alt="" style="line-height: 100%; padding-top: 6px; padding-left: 8px;" src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q_FQT6nwEC8AAAAAAAAAAABkARQnAQ" width="20" height="20" />  
+          </div>
+          <span style="margin:auto; padding:auto; color: #5B8FF9">${cfg.label}</span>
+        </div>
+          `
+      },
+      draggable: true
+    });
+  },
+}, 'single-node');
+
+const data = {
+  nodes: [
+    {
+      id: 'node1',
+      x: 100,
+      y: 200,
+      label: '首页监控',
+    },
+    {
+      id: 'node2',
+      x: 300,
+      y: 200,
+      label: '子页面',
+    },
+  ],
+  edges: [
+    {
+      source: 'node1',
+      target: 'node2',
+    },
+  ],
+};
+
+  const container = React.useRef();
+  useEffect(() => {
+    if (!graph) {
+      graph = new G6.Graph({
+        container: container.current as string | HTMLElement,
+        width: 500,
+        height: 600,
+        renderer: 'svg',
+        defaultNode: {
+          type: 'dom-node',
+          size: [120, 40]
+        },
+        defaultEdge: {
+          type: 'polyline',
+          style: {
+            radius: 20,
+            offset: 45,
+            endArrow: true,
+            lineWidth: 2,
+            stroke: '#C2C8D5',
+          },
+        },
+      });
+      graph.data(data);
+      graph.render();
+    }
+  });
+  return <div ref={container}></div>;
+};
+
+export default DomClick;
diff --git a/stories/Issues/issues.stories.tsx b/stories/Issues/issues.stories.tsx
index d7a05637fe..49c037352a 100644
--- a/stories/Issues/issues.stories.tsx
+++ b/stories/Issues/issues.stories.tsx
@@ -4,6 +4,7 @@ import DragCanvas from './component/drag-canvas';
 import DagreArrow from './component/dagre-arrow';
 import ChageData from './changeData'
 import ChangeAttr from './attrs'
+import DomClick from './component/dom-click'
 
 export default { title: 'Issues' };
 
@@ -20,3 +21,7 @@ storiesOf('Issues', module)
 .add('change attr', () => (
   <ChangeAttr />
 ))
+.add('dom click', () => (
+  <DomClick />
+))
+