路由

刷新组件

第一种　　最直接整个页面重新刷新

location.reload()
this.$router.go(0)

第二种 　　新建一个空白页面supplierAllBack.vue，点击确定的时候先跳转到这个空白页，然后再立马跳转回来

this.$router.replace({path:'/name',name:'edfw'})

第三种  　　provide / inject 组合 方式是我试过最实用的，下面用项目截图给大家说明下：首先，要修改下你的app.vue

<template>
    <div id="app">
        <transition name="fade" mode="out-in">
            <router-view  v-if="isRouterAlive"></router-view>
        </transition>
    </div>
</template>

<script>
export default {
    name: 'app',
    provide(){    //刷新当前界面
        return{
            reload:this.reload
        }
    },
    data(){
        return{
            isRouterAlive: true,
        } 
    },
    methods:{
        reload () {
             this.isRouterAlive = false
             this.$nextTick(() => (this.isRouterAlive = true))
           } 
    },
    components: { }
} 
</script> 
<style lang="scss">
body {
    margin: 0px;
    padding: 0px; 
}  </style>

通过声明reload方法，控制router-view的显示或隐藏，从而控制页面的再次加载，这边定义了

然后在需要当前页面刷新的页面中注入App.vue组件提供（provide）的 reload 依赖，然后直接用this.reload来调用就行

import { AddAdminUserGroup,UpAdminUserGroup} from '../../api/api';  
export default {
    inject:['reload'],  //跳转注入依赖
    data() { 
        return {
            DataList:"",              //要编辑的菜单行 
            TitleMenu:0,            //添加还是编辑标题
            FormData: {             //表单添加  
                Name: ''       //组名 
            }
        }
    }, 
    created:function() { 
       this.reload(); 
　　}
}   

路由跳转

this.$router.push({ path: '/roomlistlog' });

默认路由

 

export default new Router({
  routes: [
    {path: '/', redirect: 'goods'},
    {path: '/goods', component: goods},
    {path: '/ratings', component: ratings},
  ]
})

 

路由配置

//后台界面
    { path: '/admin', component: admin, name: '登录' },
    { path: '/404', component: NotFound, name: '', hidden: true,name: '错误页面'   }, 
    { path: '*', hidden: true, redirect: { path: '/404' }, title: "上海鼎鬲物联平台"  },
    { path: '/AdminHome', component: AdminHome,  iconCls: 'el-icon-message',//图标样式class
        children: [ 
            { path: '/404', component:NotFound}, 
            { path: '/WebIndex', component:WebIndex,name:"后台主页"},  
            { path: '/SiteMenu', component:SiteMenu,name:"站点菜单管理",
                children:[{ path: '/AddSiteMenu', component:AddSiteMenu,name:"站点菜单设置"}]
            }, 
            { path: '/DataInfor', component: DataInfor,name:"京东设备数据"}
        ]
    }