由于vue3组件中无法访问 this, 因此无法访问 this.router
解决方法(总的来说,语法和vue2的差不多,只是没有了this和$)
1.通过useRoute()可以获取页面 route 信息
<script setup>
import { useRoute } from 'vue-router'
const route = useRoute()
//获取到当前路由路径(基本路径)
console.log(route.path)
//获取到当前路由路径(带参数的完整路径)
console.log(route.fullPath)
//获取路径上的参数(id)
console.log(route.query)
</script>
2.通过 useRouter() 可以获取 router 路由实例信息
<script setup>
import { useRouter } from 'vue-router'
const router = useRouter()
const login = () => {
//路由跳转
router.push('/home')
}
</script>