Vue3使用router,params传参为空问题

<template>
	<span
		class="battery-capacity"
        @click="goBatteryClusterInfo(index)">
     </span>
</template>
<script setup lang="ts">
import { useRouter } from "vue-router"

const router = userRouter;
const goBatteryClusterInfo = (index: number): void => {
    let param = index + 1;
    router.push({
      name: "batteryClusterDetail",
      query: { param },
    });
};
</script>

<template>
	<span
		class="battery-capacity"
        @click="goBatteryClusterInfo(index)">
     </span>
</template>
<script setup lang="ts">
import { useRouter } from "vue-router"

const router = userRouter;
const goBatteryClusterInfo = (index: number): void => {
    let param = index + 1;
    // 使用 History API 方式传递和接收,在跳转前的页面使用 state 参数
    router.push({
      name: "batteryClusterDetail",
      state: { param },
    });
};
</script>

// 获取history中我们上个页面保存的数据
const historyParam = history.state.param;
console.log(history.state,"history.state")