vue遞歸組件問題

導航欄遞歸組件報錯
<template>

<el-submenu v-if="item.child && item.child.length" :index="navIndex"> 
    <!-- 創(chuàng)建父級菜單 -->
    <template slot="title"><i v-if="item.icon" class="item.icon"></i>{{ item.name }}</template>
    <!-- 創(chuàng)建子菜單 -->
    <nav-bar-item v-for="(subItem,i) in item.child" :key="navIndex+'-'+i" :navIndex="navIndex+'-'+i" :item="subItem" ></nav-bar-item>
</el-submenu>
<el-menu-item v-else :index="item" :route="{path: item.url}" ><i v-if="item.icon" class="item.icon"></i>{{ item.name }}</el-menu-item>

</template>

<script>
export default {

name: 'NavBarItem',
props: ['item','navIndex']

}
</script>

在父組件中調(diào)用
<nav-bar-item v-for="(item, index) in navList" :item="item" :navIndex="String(index)" ></nav-bar-item>
然后一直報錯