【Nuxt】编程式导航和动态路由

编程式导航

navigateTo：

更多用法：navigateTo

<template><div class="app-container"><button @click="goToCategory">Category</button><NuxtPage/></div>
</template>
<script setup>
const goToCategory = () => {// 1. 直接传递一个路径参数// return navigateTo('/category')// 2. 传递一个对象// return navigateTo({//   path: '/category',//   query: {id: 1}// }, {//   replace: true// });// 3. 再传递一个 options 配置项// 4. 直接跳转到外部链接return navigateTo('https://www.baidu.com', {external: true})
}
</script>

除了可以使用navigateTo，还支持 useRouter（用法相同） 进行编程式导航。

动态路由

通过 useRoute() 可以获取动态参数（route.params）。

查询字符串参数通过 route.query 获取。