vuejs 写树状二级菜单加上path 路径之后 导致 地址错轮

<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:"综合实例 ",
                    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当我点没children的子路由的时候地址正常,但是当我点了有children的子路由的时候地址就乱了 就像这样

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


http://localhost:8080/index/explame/form、
点了有子路由的综合实例在点没有子路由的 然后 路由就乱了 就像下面这样 不知道问题出那了
http://localhost:8080/index/explame/table
阅读 1.3k
1 个回答

可以吧path路径补全

path:'index/explame/form'
path:'index/explame/edit'
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题