鍍金池/ 問答/HTML/ vuejs 寫樹狀二級菜單加上path 路徑之后 導(dǎo)致 地址錯輪

vuejs 寫樹狀二級菜單加上path 路徑之后 導(dǎo)致 地址錯輪

<template>

<div class="slide">
    <div v-for="(item,index) in list" class="slide-wrap"  @click="showList(item)">

        <router-link class="title"  tag="div"  :to="{ path: item.path }">
            <i :class="icons[index]" class="icons"></i>
                {{item.title}} 
            <i class="icon-ml el-icon-arrow-right" v-if="item.children"></i>
            <!-- <i v-show="item.isShow" class="el-icon-arrow-down icon-ml"></i> -->
        </router-link >
        
    
        <div v-if="item.children" v-show="item.isShow" >
            <div class="title1" v-for="items in item.children" >{{items.title}}</div>
        </div>
        
        
    </div>
</div>

</template>

<script>

export default{
    name:'HomeSlide',
    data(){
        return {
            list:[
                {
                    id:0,
                    isShow: false,
                    title:"首頁",
                    path: 'person'
                },
                {
                    id:3,
                    isShow: false,
                    title:"示例表格 ",
                    path: 'table'
                },
                {
                    id:4,
                    title:"綜合實(shí)例 ",
                    isShow: false,
                    rightTir: true,
                    path: 'explame',
                    children:[
                        {
                            id: 0,
                            title: "form表單編輯",
                            path: 'form'
                        },
                        {
                            id: 1,
                            title: "富文本編輯",
                            path: 'edit'
                        }
                    ]
                }
            ]
            
        }
    },
    methods: {
        showList(item){
            console.log( this.$route.path )
            if( item.children ){
                item.isShow = !item.isShow
            }    
            
        }
    }
    
}

</script>

圖片描述

代碼是組圖片是main.js當(dāng)我點(diǎn)沒children的子路由的時候地址正常,但是當(dāng)我點(diǎn)了有children的子路由的時候地址就亂了 就像這樣

http://localhost:8080/index/table  
http://localhost:8080/index/person  


http://localhost:8080/index/explame/form、
點(diǎn)了有子路由的綜合實(shí)例在點(diǎn)沒有子路由的 然后 路由就亂了 就像下面這樣 不知道問題出那了
http://localhost:8080/index/explame/table
回答
編輯回答
艷骨

可以吧path路徑補(bǔ)全

path:'index/explame/form'
path:'index/explame/edit'
2018年6月11日 09:32