vue获取当前页面的地址

在Vue.js框架中，获取当前页面地址可以通过JavaScript的原生对象`window.location`来实现。由于Vue是运行在浏览器端的框架，可以直接使用浏览器提供的全局对象来获取当前页面的URL信息。

具体来说，可以使用`window.location.href`获取完整的URL地址，使用`window.location.pathname`获取URL的路径部分，使用`window.location.search`获取URL中的查询字符串部分（即问号后的部分），使用`window.location.hash`获取URL的锚点部分（即井号后的部分）。

在Vue组件中，如果你想在某个生命周期钩子或者方法中获取当前地址，可以这样做：

// 在Vue组件的methods中添加一个方法来获取当前地址
methods: {
  getCurrentUrl() {
    // 获取完整的URL地址
    console.log(window.location.href);
    // 获取路径部分
    console.log(window.location.pathname);
    // 获取查询字符串部分
    console.log(window.location.search);
    // 获取锚点部分
    console.log(window.location.hash);
  }
}

在实际应用中，如果你需要在Vue中进行路由管理，通常会使用Vue Router。Vue Router提供了导航守卫功能，可以在路由变化时执行相应的操作。例如，在路由跳转前获取当前路由地址，可以使用`beforeRouteEnter`和`beforeRouteUpdate`导航守卫：

beforeRouteEnter (to, from, next) {
  // 在渲染该组件的对应路由被 confirm 前调用
  // 不！能！获取组件实例 `this`
  // 因为当守卫执行前，组件实例还没被创建
  next(vm => {
    // 通过 `vm` 访问组件实例
  })
},

beforeRouteUpdate (to, from, next) {
  // 在当前路由改变，但是该组件被复用时调用
  // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候，
  // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个守卫就会在这种情况下被调用。
  this.currentUrl = window.location.href;
  next();
}