在Vue中，你可以使用Vue Router来监听页面的关闭。以下是一个示例：

首先，确保你已经安装了Vue Router和axios。如果没有，可以使用npm或yarn进行安装：

bash npm install vue-router axios

然后，创建一个名为app.js的文件，并添加以下代码：

```javascript import Vue from 'vue' import VueRouter from 'vue-router' import Home from './components/Home.vue' import About from './components/About.vue' import Contact from './components/Contact.vue'

Vue.use(VueRouter)

const routes = [ { path: '/home', component: Home }, { path: '/about', component: About }, { path: '/contact', component: Contact } ]

const router = new VueRouter({ routes })

export default router ```

在这个例子中，我们定义了三个路由，分别对应于Home、About和Contact组件。然后，我们创建了一个Vue Router实例，并使用它来创建一个路由映射。

在app.js文件的mounted生命周期钩子中，我们可以监听页面的关闭。以下是一个示例：

javascript export default { mounted() { this.$router.on('before-leave', (to, from) => { axios.post('/api关闭页面') .then(() => { console.log('页面已关闭，请求已发送。') }) .catch((error) => { console.error('关闭页面时发生错误:', error) }); }); } }

在这个示例中，我们在mounted钩子中使用Vue Router的before-leave事件来监听页面的关闭。然后，我们使用axios.post发送一个POST请求到/api关闭页面路由，然后在成功发送请求后打印一条消息，最后在请求发生错误时打印错误信息。

请注意，这个示例假设你已经在app.js文件中设置了axios的全局依赖。如果你没有这样做，你需要在app.js文件的顶部添加以下代码：

javascript import axios from 'axios'