Vue 点击当前菜单但不更新路由，实现再次加载组件

1、在当前菜单添加点击事件

对应的菜单标签中添加事件，例如  @click="itemClick()"

 

2、在点击事件中，使用 Math.random()函数 和 this.$router.replace()函数

/**
* 实现点击 指定菜单，达到再次加载组件，如： 需要重新请求当前组件需要的 api接口
* （类似刷新效果，但页面不需要重新渲染，只是数据重新加载）
*/
itemClick() {    
    let path = this.$route.path;
    if(path === '需要点击的菜单路径值') {
        // 在路由后面添加参数`随机数`，即可再次加载组件（注意是'?'， 而不是'/'，否则找不到路径哈）
        let num = Math.floor(Math.random()*1000 + 1);
        this.$router.replace(`${path}?${num}`)
    }    
}

 

 

 

写给自己的随笔，有问题欢迎指出ψ(*｀ー´)ψ