vue3中useRouter

useRoute

> 作用获取路由配置对象。

- 获取路由参数

~~~vue

<script setup>

import { useRoute } from 'vue-router';

let $route = useRoute();

console.log($route.query);

</script>

~~~

1.ShopCar.vue 文件配置

<template>
    <h1>shop car {
  { $route.params.id }}{
  { $route.params.title }}</h1>
    <div class="list">
        <ul>
            <li v-for="item in list.shopcar" :key="item.id" @click="e=>change(item)">
              <h2>名称：{
  { item.title }}</h2>
              <h2>价格: {
  { item.price }}</h2>
            </li>
        </ul>
    </div>
</template>
<script setup>
import { reactive} from 'vue';
import { useRoute,useRouter } from 'vue-router'
let $route = useRoute();
let $