docs: update demo

pull/538/head
tangjinzhou 6 years ago
parent c47582a93e
commit 89c3a56362

@ -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>

@ -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>

@ -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: {

@ -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,

Loading…
Cancel
Save