본문 바로가기

Javascript Tips

vue3) router에서 데이터 넘기기 ($route.params 사용)

728x90
import { createWebHistory, createRouter } from 'vue-router';

import LoginForm from "@/components/Login/LoginForm";
import LoginKeypad from "@/components/Login/LoginKeypad";
import Schedule from "@/components/Schedule/Schedule";
import Anothers from "@/components/Schedule/Anothers";
// 
const routes = [
  {
    path: "/",
    component: LoginForm
  },
  {
    path: "/password/:a/:b", // <<< 넘길 key값
    name: 'Password',
    component: LoginKeypad,
  },
  {
    path: "/schedule",
    component: Schedule
  },
  {
    path: "/anothers",
    component: Anothers
  },

];

const router = createRouter({
  history: createWebHistory(),
  routes
});

export default router;

 

보낼 페이지

a,b를 넘기면 

해당 키값들이 

this.$route.params 안에 다 들어가있다. 

 


받은 페이지

 

 

 

 

꼭 router 객체의

router 속성에다가 

추가될 키값을 path 뒤에 붙여줘야한다