vue中怎么监听路由变化

在Vue中，你可以使用`vue-router`来监听路由变化。以下是一种常见的方式：

1. 首先，确保在你的项目中安装了`vue-router`。你可以使用以下命令进行安装：

npm install vue-router

2. 在你的Vue应用程序的入口文件中，导入`vue-router`并创建一个新的路由实例。例如，在`main.js`文件中：

import Vue from 'vue';
import VueRouter from 'vue-router';
import App from './App.vue';

Vue.use(VueRouter);

const router = new VueRouter({
  // 配置你的路由选项
  // ...
});

new Vue({
  router,
  render: h => h(App),
}).$mount('#app');

3. 在你的组件中，你可以使用`$route`对象来监听路由的变化。例如，在一个组件中：

export default {
  created() {
    this.$watch('$route', (to, from) => {
      // 路由变化时执行的逻辑
      console.log(`路由从${from.path}切换到${to.path}`);
    });
  },
};

通过以上步骤，你就可以在Vue中监听路由的变化了。每当路由发生变化时，`created`生命周期钩子函数会被调用，并且可以在其中编写你想要执行的逻辑。