Nuxt3（Composition API）如何获取路由参数？

在你的Order.vue页面中，可通过Nuxt3内置的useRoute()组合式函数获取跳转传递的参数，具体实现如下：

基础用法 #

<script setup>
import { useRoute } from 'vue-router'

const route = useRoute()
// 获取ordMediaCd参数
const ordMediaCd = route.params.ordMediaCd
// 可直接使用该参数，比如打印查看
console.log(ordMediaCd)
</script>

优化跳转代码（避免参数丢失） #

注意：Vue Router中，当同时指定path和params时，params会被忽略，建议跳转时只保留路由名称与参数：

// basket.vue中修改跳转代码
navigateTo({
    name: 'or-order-Order',
    params: {
      ordMediaCd: '01'
    }
});

解构简化写法 #

也可以直接解构useRoute()返回的对象，简化代码：

<script setup>
const { params } = useRoute()
const ordMediaCd = params.ordMediaCd
</script>

内容的提问来源于stack exchange，提问作者Yumi Park