vue3 router에서 param 전달

 

라우터에서 아래 처럼 등록을 하면

{

          path: '/nickname/lock/view/:id',

          name: 'nickname.lock.view',

          component: () => import('@/pages/nickname/popup/lockHistoryView.vue'),

          meta: { tenantSelector: true }

        }

 

부모창에서 아래 처럼 param을 보내면

 router.push({

    name: 'nickname.lock.view',

    params: { id: '11' }

  })

 

 

이동된 화면에서 아래 처럼 params로 받아서 사용할 수 있음 이것은 post 방식의 param 전송과 아무 관련이 없음

const { id } = route.params

 

 

라우터에 아래 처럼 등록 할때 get 방식으로 param을 쏠때는 query를 사용해 주면 됨

{

          path: '/nickname/lock/view',

          name: 'nickname.lock.view',

          component: () => import('@/pages/nickname/popup/lockHistoryView.vue'),

          meta: { tenantSelector: true }

        }

 

 

router.push({ name: 'nickname.lock.view', query: { id: '211' } })

 

받을때는 아래 처럼

  const { id } = route.query

 

 

 

자꾸 한국말로 되어 있는 블로그에서 잘못된 정보를 알려줘서 화가 나서 적음