极客观点
项目管理
HarmonyOS
我想点击Foo1时，隐藏Foo1,显示我是foo，然后点浏览器回退按钮回到最初状态（即直只显示Foo1），该如何实现？怎么侦听路由hash变化？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id='app'>
<h1 >Hello VUE-Route</h1>
<p>
<router-link v-on:click='toggle' to='/foo'>Foo1</router-link>
</p>
<router-view></router-view>
</div>
</body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<script>
// 1 定义路由组件，可以从其他地方引入
const Foo={
template:"<p>我是foo</p>"
}
//2 定义路由,每个路由包括两个部分，path和component，以数组形式存储
const routes=[
{path:"/foo",component:Foo},
]
// 3 实例化router
const router=new VueRouter({
routes:routes
})
//挂载app
const app=new Vue({
el:"#app",
data:{
ifShow:true
},
methods:{
toggle:function(e){
alert(22)
this.ifShow=false
}
},
router:router
})
</script>
</html>
有人知道如何解决么？