vue3.x版本路由router跳轉+傳參

顯示傳參模式 get

import { useRouter } from 'vue-router';
  const router = useRouter();
  let skipEdit = (key: string, res: any) => { // 個人需求函數自行省略
    router.push({
      path: 'editRole',
      query: {
        key: key,
        body: res,
      },
    });
  };
// 接收
import { useRoute } from 'vue-router';
  setup() {
  
    const route = useRoute(); // 1 
    
    let res: any = ref({});
    let get = async () => {
      res.value = await getParticulars({ categoryName: route.query.name // 2 });
    };
    onMounted(get);
    return {
      columns,
      get,
      res,
    };
  },

隱式傳參模式 post

import { useRouter } from 'vue-router';
  const router = useRouter();
  let skipEdit = (key: string, res: any) => {  // 個人需求函數自行省略
    router.push({
      name: 'EditRole',
      params: {
        key: key,
       body:JSON.stringify(res),
      },
    });
  };
// 接收
  setup() {
    const route: any = useRoute();
    if (route.params.body) {
      let obj = JSON.parse(route.params.body);
      console.log(JSON.parse(obj));
    }
    return {
      date,
    };
  },