vue3中路由跳轉及傳參

vue3中在setup中並沒有this,所以路由跳轉和傳參的方式都要有所改變

1.路由跳轉

1.1 引入import { useRouter } from 'vue-router'

1.2在setup中創建路由對象 ，語法以前vue2類似，這里攜帶id的路由參數

setup(){
    const router = useRouter();
    function goSeekHelpDetail (){
      router.push({
        name:'taskSeekHelpDetail',
        query:{
          id: '1'
        }
      })
    };
    return{
    }
  }

2.這里獲取路由參數，就在vue3新增的onMounted生命鈎子獲取路由參數。

import {getCurrentInstance,onMounted} from 'vue'

setup(props,{emit}){
    const router = useRouter();
    onMounted(()=>{
      // 獲取當前路由實例參數
      console.dir(router.currentRoute.value.query.id);
    })
    return{
    }
  }

成功獲取id的值