반응형
Vue 라우터를 사용하여 리디렉션할 때 매개 변수를 전달하는 방법
여기에 특정 ID로 양식에 액세스하기 전에 먼저 로그인하는 것을 처리하는 샘플 Vue 라우터가 있다.
router = new VueRouter({
routes: [
{path: '/form/:id', redirect: '/login'},
{path: '/login', name: 'Login', component: Login}
]
});
내가 http://localhost:8080/form/c101-101을 실행하면 로그인 구성요소로 직접 리디렉션되고 로그인을 시도할 때 로그인이 전달된 :id 매개 변수에 계속 액세스할 수 있는 방법이 있는가?로그인 컴포넌트 내 $route.params.id은 정의되지 않았다.리디렉션 시 :id를 전달할 수 있는 방법이 있을까?
여전히 이 문제를 겪고 있는 사용자에게는 Vue 문서에 따라 동적 리디렉션 기능을 사용할 수 있다.
파라미터를 사용하는 예(예:yourdomain.com/:yourParam
() 및 매개 변수를 사용하여 다른 URL로 리디렉션yourParam
쿼리 문자열로 ()yourdomain.com/your/route?yourQueryString=:yourParam
):
redirect: to => ({
name: "your-named-route",
query: { yourQueryString: to.params.yourParam },
}),
참고: 이 구문은 ES6를 사용하고 있다.
다음과 같이 로그인 경로에서 /:id를 선택사항으로 만들 수 있다.
router = new VueRouter({
routes: [
{path: '/form/:id', redirect: '/login/:id'},
{path: '/login/:id?', name: 'Login', component: Login}
]
});
위의 코드 조각으로 당신은 이것을 얻을 수 있을 것이다.로그인 구성 요소에서 $route.params.id.
참조URL: https://stackoverflow.com/questions/49934179/how-to-pass-parameters-on-redirecting-using-vue-router
반응형
'programing' 카테고리의 다른 글
반응: 라디오 버튼 컬렉션에 선택한 항목이 있는지 확인하는 방법 (0) | 2022.03.10 |
---|---|
Vue SSR serverPrefetch server 리디렉션$ssrContext.res.redirect (0) | 2022.03.10 |
Typecript Vuex 객체가 알 수 없는 유형인 Vue Vuex (0) | 2022.03.10 |
UnicodeEncodeError: 'ascII' 코덱이 위치 20에서 문자 u'\xa0'을 인코딩할 수 없음: 서수가 범위(128)에 없음 (0) | 2022.03.10 |
Scheduler.animationFrame과 fromEvent(윈도우, 'scroll') 스트림을 rxj로 어떻게 결합하시겠습니까? (0) | 2022.03.10 |