1、注意事项
Ⅰ、
路由跳转使用useRouter或者useRoute时,必须在setup的顶层作用域使用不可以在函数内部使用。
// 正确写法
<script setup>
import { useRouter } from 'vue-router';
const router = useRouter()
const pushIndex = ()=>{
router.push({path:'/index'})
}
</script>
// 错误写法
<script setup>
import { useRouter } from 'vue-router';
const pushIndex = ()=>{
useRouter().push({path:'/index'}) //此时的useRouter()是undefined
}
</script>
路由跳转也可以直接import router的index.js来使用
import router from '../router'
const pushIndex = ()=>{
router.push({path:'/index'}) // 此时的router可以在任何地方使用
}
Ⅱ、
获取当前的路由的两种方法
方法一
import router from '../router'
const currentRoute = router.currentRoute.value
方法二
import { useRoute } from 'vue-router'
const currentRoutePath = useRoute().path
const currentRouteParams = useRoute().params