vue3 a页面 跳转到 b页面携带 x,y 两个参数 判断是否有这两个参数 有就存到 pinia里

在 Vue 3 中，如果你使用的是 Pinia（Vue 3 的官方状态管理库）来管理应用的状态，你可以通过路由导航守卫（`beforeRouteEnter` 或者 `beforeCreate`）来判断从 A 页面传递过来的参数 x 和 y 是否存在，并将它们存储到 Pinia 的 store 中。首先确保你在项目中安装了 Vue Router 和 Pinia：

npm install @vue-router/vite @pinia/core @pinia/router

接下来，在 A 页面组件内，你可以这样发送参数：

<router-link :to="{ name: 'b', params: { x: yourXParam, y: yourYParam }}" />

然后在 B 页面的组件或者全局的 Pinia store 中设置守卫：

// B.vue 或 main.js (如果是在全局设置)
import { useStore } from '@pinia/runtime'
import { defineStore } from 'pinia'

export const store = defineStore('commonStore', {
  state() {},
  actions: {
    async beforeRouteEnter(to, from, next) {
      try {
        const routerParams = to.params || {} // 获取当前路由的参数
        const x = routerParams.x;
        const y = routerParams.y;

        if (x && y) {
          // 将参数保存到 store
          this.$store.state.commonData = { x, y };
          await next(); // 继续路由跳转
        } else {
          // 如果缺少参数，可以在这里显示错误消息或跳转回上一页
          console.error('Missing parameters x and y');
          next(false); // 返回 false 可阻止路由跳转
        }
      } catch (error) {
        console.error(error);
        next(false);
      }
    }
  },
});

现在，当用户从 A 页面通过参数跳转到 B 页面时，如果有 x 和 y 参数，Pinia 的 store 就会收到并存储这些数据。如果没有，会在控制台打印错误信息并停止路由跳转。