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,
    };
  },


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM