diff --git a/components/menu/demo/SubMenu.vue b/components/menu/demo/SubMenu.vue
index d0402468a..eeb878e70 100644
--- a/components/menu/demo/SubMenu.vue
+++ b/components/menu/demo/SubMenu.vue
@@ -1,7 +1,6 @@
 <template functional>
   <a-sub-menu
-    :key="data.key"
-    v-on="listeners"
+    :key="props.menuInfo.key"
   >
     <span slot="title">
       <a-icon type="mail" /><span>{{ props.menuInfo.title }}</span>
diff --git a/components/menu/demo/SubMenu1.vue b/components/menu/demo/SubMenu1.vue
new file mode 100644
index 000000000..90a50d692
--- /dev/null
+++ b/components/menu/demo/SubMenu1.vue
@@ -0,0 +1,41 @@
+<template>
+  <a-sub-menu
+    :key="menuInfo.key"
+    v-bind="$props"
+    v-on="$listeners"
+  >
+    <span slot="title">
+      <a-icon type="mail" /><span>{{ menuInfo.title }}</span>
+    </span>
+    <template v-for="item in menuInfo.children">
+      <a-menu-item
+        v-if="!item.children"
+        :key="item.key"
+      >
+        <a-icon type="pie-chart" />
+        <span>{{ item.title }}</span>
+      </a-menu-item>
+      <sub-menu
+        v-else
+        :key="item.key"
+        :menu-info="item"
+      />
+    </template>
+  </a-sub-menu>
+</template>
+<script>
+import { Menu } from 'ant-design-vue';
+export default {
+  name: 'SubMenu',
+  // must add isSubMenu: true
+  isSubMenu: true, 
+  props: {
+    ...Menu.SubMenu.props,
+    // Cannot overlap with properties within Menu.SubMenu.props
+    menuInfo: { 
+      type: Object,
+      default: ()=>({}),
+    },
+  },
+};
+</script>
diff --git a/components/menu/demo/template.md b/components/menu/demo/template.md
index 44e48ee76..279c2fd0c 100644
--- a/components/menu/demo/template.md
+++ b/components/menu/demo/template.md
@@ -1,13 +1,13 @@
 <cn>
 #### 单文件递归菜单
 使用单文件方式递归生成菜单。
-因组件内部会动态更改`a-sub-menu`的属性，如果拆分成单文件，无法将属性挂载到`a-sub-menu`上，你需要自行声明属性并挂载。为了实现方便，避免了属性的声明，本示例将其声明为函数式组件，并将所有属性挂载到`a-sub-menu`上。
+因组件内部会动态更改`a-sub-menu`的属性，如果拆分成单文件，无法将属性挂载到`a-sub-menu`上，你需要自行声明属性并挂载。为了方便，避免属性的声明，我们推荐使用函数式组件。
 </cn>
 
 <us>
 #### Single file recursive menu
 Use the single file method to recursively generate menus.
-The properties of `a-sub-menu` are dynamically changed inside the component. If you split the file into a single file and you cannot mount the `props` to `a-sub-menu`, you need to declare the `props` and mount it yourself. For the sake of convenience, the declaration of the `props` is avoided. This example declares it as a functional component and mounts all properties to `a-sub-menu`.
+The properties of `a-sub-menu` are dynamically changed inside the component. If you split the file into a single file and you cannot mount the `props` to `a-sub-menu`, you need to declare the `props` and mount it yourself. For convenience, to avoid the declaration of attributes, we recommend using functional components.
 </us>
 
 ```html
@@ -35,7 +35,10 @@ The properties of `a-sub-menu` are dynamically changed inside the component. If
 </template>
 
 <script>
-/* SubMenu.vue https://github.com/vueComponent/ant-design-vue/blob/master/components/menu/demo/SubMenu.vue */
+/* 
+ * recommend SubMenu.vue https://github.com/vueComponent/ant-design-vue/blob/master/components/menu/demo/SubMenu.vue
+ * SubMenu1.vue https://github.com/vueComponent/ant-design-vue/blob/master/components/menu/demo/SubMenu1.vue
+ * */
 import SubMenu from './SubMenu'
 export default {
   components: {
diff --git a/components/vc-menu/SubMenu.jsx b/components/vc-menu/SubMenu.jsx
index 8f2eec35c..d7de4f567 100644
--- a/components/vc-menu/SubMenu.jsx
+++ b/components/vc-menu/SubMenu.jsx
@@ -48,7 +48,6 @@ const SubMenu = {
     triggerSubMenuAction: PropTypes.string,
     popupClassName: PropTypes.string,
     getPopupContainer: PropTypes.func,
-    test: PropTypes.any,
     forceSubMenuRender: PropTypes.bool,
     openAnimation: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
     disabled: PropTypes.bool,