Ant Design Vue 2.x 递归Menu

Vue.component(‘LmSubMenu‘, {
    functional: true,
    render: function (createElement, context) {
        console.log(context)
        let children = [];
        context.props.menuInfo.child.forEach((item, index) => {
            if (item.child) {
                children.push(
                    createElement(‘lm-sub-menu‘, {
                        props: {menuInfo:item}
                    })
                )
            } else {
                children.push(createElement(‘a-menu-item‘, {
                    //普通html特性
                    attrs: {
                        key: item.href,
                    },
                }, item.title))
            }
        });

        return createElement(‘a-sub-menu‘, [
            createElement(‘span‘, {
                slot: ‘title‘
            }, [
                createElement(‘a-icon‘, {
                    //普通html特性
                    attrs: {
                        type: ‘team‘,
                    },
                }), createElement(‘span‘, context.props.menuInfo.title)]),
            ...children
        ])
    }
})

<a-menu
                    class="a-menu"
                    mode="inline"
                    theme="dark"
                    :inline-collapsed="collapsed">
                <template v-for="item in initinfo.menuInfo">
                    <a-menu-item v-if="!item.child" :key="item.href">
                        <a-icon type="pie-chart"></a-icon>
                        <span>{{ item.title }}</span>
                    </a-menu-item>
                    <lm-sub-menu v-else :menu-info="item"></lm-sub-menu>
                </template>
            </a-menu>