diff --git a/docs/demo/ssr-off.md b/docs/demo/ssr-off.md
new file mode 100644
index 00000000..085f9244
--- /dev/null
+++ b/docs/demo/ssr-off.md
@@ -0,0 +1,3 @@
+## ssr off
+
+<code src="../examples/ssr-off.tsx"></code>
diff --git a/docs/examples/ssr-off.tsx b/docs/examples/ssr-off.tsx
new file mode 100644
index 00000000..059dfa00
--- /dev/null
+++ b/docs/examples/ssr-off.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import '../../assets/index.less';
+import Menu, { Divider, Item as MenuItem, SubMenu } from '../../src';
+
+const nestSubMenu = (
+  <SubMenu
+    title={<span className="submenu-title-wrapper">offset sub menu 2</span>}
+    key="4"
+    popupOffset={[10, 15]}
+  >
+    <MenuItem key="4-1">inner inner</MenuItem>
+    <Divider />
+    <SubMenu
+      key="4-2"
+      title={<span className="submenu-title-wrapper">sub menu 1</span>}
+    >
+      <SubMenu
+        title={<span className="submenu-title-wrapper">sub 4-2-0</span>}
+        key="4-2-0"
+      >
+        <MenuItem key="4-2-0-1">inner inner</MenuItem>
+        <MenuItem key="4-2-0-2">inner inner2</MenuItem>
+      </SubMenu>
+      <MenuItem key="4-2-1">inn</MenuItem>
+      <SubMenu
+        title={<span className="submenu-title-wrapper">sub menu 4</span>}
+        key="4-2-2"
+      >
+        <MenuItem key="4-2-2-1">inner inner</MenuItem>
+        <MenuItem key="4-2-2-2">inner inner2</MenuItem>
+      </SubMenu>
+      <SubMenu
+        title={<span className="submenu-title-wrapper">sub menu 3</span>}
+        key="4-2-3"
+      >
+        <MenuItem key="4-2-3-1">inner inner</MenuItem>
+        <MenuItem key="4-2-3-2">inner inner2</MenuItem>
+      </SubMenu>
+    </SubMenu>
+  </SubMenu>
+);
+
+function handleClick(info) {
+  console.log(`clicked ${info.key}`);
+  console.log(info);
+}
+
+function Demo() {
+  return (
+    <>
+      <Menu mode="horizontal" onClick={handleClick} ssr="off">
+        <SubMenu
+          title={<span className="submenu-title-wrapper">sub menu</span>}
+          key="1"
+        >
+          <MenuItem key="1-1">0-1</MenuItem>
+          <MenuItem key="1-2">0-2</MenuItem>
+        </SubMenu>
+        {nestSubMenu}
+        <MenuItem key="2">1</MenuItem>
+        <MenuItem key="3">outer</MenuItem>
+        <MenuItem key="5" disabled>
+          disabled
+        </MenuItem>
+        <MenuItem key="6">outer3</MenuItem>
+      </Menu>
+    </>
+  );
+}
+
+export default Demo;
diff --git a/src/Menu.tsx b/src/Menu.tsx
index ef9db196..d116a6d3 100644
--- a/src/Menu.tsx
+++ b/src/Menu.tsx
@@ -78,6 +78,9 @@ export interface MenuProps
   activeKey?: string;
   defaultActiveFirst?: boolean;
 
+  // SSR control
+  ssr?: 'full' | 'off';
+
   // Selection
   selectable?: boolean;
   multiple?: boolean;
@@ -183,6 +186,9 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
     activeKey,
     defaultActiveFirst,
 
+    // SSR
+    ssr,
+
     // Selection
     selectable = true,
     multiple = false,
@@ -239,6 +245,7 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
   const uuid = useUUID(id);
 
   const isRtl = direction === 'rtl';
+  const ssrVal = ssr === 'off' ? undefined : 'full';
 
   // ========================= Warn =========================
   if (process.env.NODE_ENV !== 'production') {
@@ -581,7 +588,7 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
           ? Overflow.INVALIDATE
           : Overflow.RESPONSIVE
       }
-      ssr="full"
+      ssr={ssrVal}
       data-menu-list
       onVisibleChange={newLastIndex => {
         setLastVisibleIndex(newLastIndex);