vue

vue-router如何响应路由参数的变化?

发布于 2021-01-11 17:02:18
关注者
0
被浏览
406
4 个回答
  • 面试哥
    面试哥 2021-01-12
    为面试而生,有面试问题,就找面试哥。

    ickt-5:
    路由 vue-router 面试题:
    https://blog.csdn.net/Arthas_Xue/article/details/101024666
    在父组件的router-view上加个key:
    https://www.jianshu.com/p/802f357d9699

  • 面试哥
    面试哥 2021-01-12
    为面试而生,有面试问题,就找面试哥。

    问题:为什么要响应参数变化?

    • 切换路由,路由参数发生了变化,但是页面数据并未及时更新,需要强制刷新后才会变化。
    • 不同路由渲染相同的组件时(组件复用比销毁重新创建效率要高),在切换路由后,当前组件下的生命周期函数不会再被调用。

    解决方案:

    1. 使用 watch 监听
    watch: {
        $route(to, from){
            if(to != from) {
                console.log("监听到路由变化,做出相应的处理");
            }
        }
    }
    1. 向 router-view 组件中添加 key
      <router-view :key="$route.fullPath"></router-view>

    $route.fullPath 是完成后解析的URL,包含其查询参数信息和hash完整路径

  • 面试哥
    面试哥 2021-01-12
    为面试而生,有面试问题,就找面试哥。
知识点
面圈网VIP题库

面圈网VIP题库全新上线,海量真题题库资源。 90大类考试,超10万份考试真题开放下载啦

去下载看看