实时获取当前页面路由，刷新不丢失获取到的路由

从网上找到好多方法，现在整理总结一下，先把网上找到的方法说一下，自己在项目里面用过，表示没问题，可以用。

当前页面 Vue如何获取当前页面的url,获取路由地址

1. 完整url可以用 window.location.href
2. 路由路径可以用 this.$route.path
3. 路由路径参数 this.$route.params例如：/user/:id\to /user/2044011030\to this.$route.params.id
4. 路由查询参数 this.$route.query例如：/user/search?name=sf\to this.$route.query.name

1

这些方法都是可以在简单的一些需求可以用到，也是没问题的，但是经过测试还是存在一个BUG，页面第一次加载切换的时候，用第二条是没问题的，但是，页面刷新后，之前获取到的路由，就木有啦，这就很烦，下面记录一下，我在项目里面如何实时获取到路由，不管点击切换到那个页面都可以实时获取，刷新也可以获取之前的路由。

2

我现在需要通过路由中的某个参数来判断项目中一些地方的显示和隐藏，这个路由是正常切换出来的，但是当我点击下面绿色字体跳转详情的时候，会跳转到这个路由上

3

但是当这次点击跳转详情页的时候路由变了，在用第二条的时候，就获取不到路由了，就很头疼，然后我就在项目里面写了一个这个方法，所有的问题都解决了。

 // 监听页面路由变化
    $route:{
      handler:function(route){
          console.log(route);
      },
      immediate:true
    }

把这个方法写在watch里面。实时监听就好啦，不管怎么切换，怎么刷新，都可以获取到当前页面的路由啦~~~~~~~~~