I would like to ask you to dynamically load the json data of level 3 menus in iview. Thank you very much.

<template>
    <Menu active-name="1-2" :open-names="["1"]">
        <Submenu name="1">
            <template slot="title">
                <Icon type="ios-analytics"></Icon>
                Navigation One
            </template>
            <MenuGroup title="Item 1">
                <MenuItem name="1-1">Option 1</MenuItem>
                <MenuItem name="1-2">Option 2</MenuItem>
            </MenuGroup>
            <MenuGroup title="Item 2">
                <MenuItem name="1-3">Option 3</MenuItem>
                <MenuItem name="1-4">Option 4</MenuItem>
            </MenuGroup>
        </Submenu>
        <Submenu name="2">
            <template slot="title">
                <Icon type="ios-filing"></Icon>
                Navigation Two
            </template>
            <MenuItem name="2-1">Option 5</MenuItem>
            <MenuItem name="2-2">Option 6</MenuItem>
            <Submenu name="3">
                <template slot="title">Submenu</template>
                <MenuItem name="3-1">Option 7</MenuItem>
                <MenuItem name="3-2">Option 8</MenuItem>
            </Submenu>
        </Submenu>
        <Submenu name="4">
            <template slot="title">
                <Icon type="ios-gear"></Icon>
                Navigation Three
            </template>
            <MenuItem name="4-1">Option 9</MenuItem>
            <MenuItem name="4-2">Option 10</MenuItem>
            <MenuItem name="4-3">Option 11</MenuItem>
            <MenuItem name="4-4">Option 12</MenuItem>
        </Submenu>
    </Menu>
</template>
<script>
    export default {
        return {
            
        }
    }
</script>

this is my tree structure. I want to dynamically render it to the three-level menu above. What do I need to do?

[{
    "attributes": {
        "url": ""
    },
    "checked": false,
    "children": [{
        "attributes": {
            "url": ""
        },
        "checked": false,
        "children": [{
            "attributes": {
                "url": "vipdate"
            },
            "checked": false,
            "ctype": "02",
            "iconCls": "icon-bars",
            "id": "450f0714",
            "state": "open",
            "text": ""
        },  {
            "attributes": {
                "url": "vipmonth"
            },
            "checked": false,
            "ctype": "02",
            "iconCls": "icon-bars",
            "id": "3f784dcf",
            "state": "open",
            "text": ""
        }],
        "ctype": "01",
        "iconCls": "icon-bars",
        "id": "488de339",
        "state": "closed",
        "text": ""
    }],
    "ctype": "01",
    "iconCls": "icon-duot",
    "id": "a3625439-a626-3993-6ace-349498f47cab",
    "state": "closed",
    "text": ""
}, {
    "attributes": {
        "url": "kehuguanli"
    },
    "checked": false,
    "children": [{
        "attributes": {
            "url": "viewPerson"
        },
        "checked": false,
        "ctype": "02",
        "iconCls": "icon-mans",
        "id": "34d68d1",
        "state": "open",
        "text": ""
    }, {
        "attributes": {
            "url": "personvip"
        },
        "checked": false,
        "ctype": "02",
        "iconCls": "icon-limi",
        "id": "6bacce8e",
        "state": "open",
        "text": ""
    }, {
        "attributes": {
            "url": "personSnap"
        },
        "checked": false,
        "ctype": "02",
        "iconCls": "icon-gree",
        "id": "dd84",
        "state": "open",
        "text": ""
    }],
    "ctype": "01",
    "iconCls": "icon-grou",
    "id": "6fa5bce8-1ff7-c06a-a8ed-f58b77038689",
    "state": "closed",
    "text": ""
}]

at present, the code I write can only render level 2, and I can"t get the data when I get to the level 3 menu.

<Menu @on-select="getName">
                <Submenu :name="index"  v-for="(MenuItem , index) of menuList" :key="index">
                    <template slot="title">
                        <Icon type="ios-filing"></Icon>
                        {{  MenuItem.text }}
                    </template>
                    <MenuItem :name="items.id" v-for="items of MenuItem.children" :key="items.id" >
                        {{ items.text }}
                        <template v-if="items.children && items.children.length>1">

                        </template>
                    </MenuItem>
                     <Submenu name="5" v-if="true" >
                        <template slot="title">aa</template>
                        <MenuItem name="3-1">Option 7</MenuItem>
                        <MenuItem name="3-2"> qwwq </MenuItem>
                    </Submenu>
                </Submenu>
            </Menu>