vue3 + ts 页面跳转传一个对象过去

在 Vue 3 中结合 TypeScript 使用，当你需要从一个组件跳转到另一个组件并传递一个对象时，可以按照以下步骤操作：

1. 定义要在组件间传递的对象类型。例如，假设你要传递的数据是一个用户模型（User）：

// 定义 User 类型
interface User {
  id: number;
  name: string;
}

2. 在发送跳转的地方，创建这个对象并将其赋值给路由传参。你可以通过 `this.$router.push` 或者 `this.$router.go` 方法完成，同时指定 `name` 参数，并将对象作为参数：

<template>
  <button @click="navigateToAnotherPage">跳转</button>
</template>

<script lang="ts">
import { useRouter } from 'vue-router';
import { User } from './types'; // 引入 User 的类型

export default {
  methods: {
    navigateToAnotherPage(user: User): void {
      this.$router.push({
        name: 'YourTargetComponent', // 替换为你目标组件的名称
        params: { user }, // 将对象作为参数传递
      });
    }
  }
};
</script>

在这个例子中，当点击“跳转”按钮时，会把当前的 `user` 对象作为参数传递到名为 "YourTargetComponent" 的组件。