vue3 setup pinia router 사용기 router guard 뷰3 라우터 가드

처음엔 지역가드로 만들었다가 다시 전역가드로 변경하였다 

 

router.beforeEach((to, from, next) => {
	// to.name , to.query.name 등을 사용하였다 
    // 중간에 if문이랑 switch 문을 섞어서 사용하였는데 case break로 안됨 
    // 내부 if문 next()에 return next()로 써버리니까 되었다 
    // 단순히 로컬스토리지나 쿠키값을 가져와서 체크할수도있지만 api에서 받아오는 값으로 구현하였다
})

 

하나의 지역가드는 남겨두었는데 

 

{
	path: '/home',
    name: 'home',
    beforeEnter: (to, from, next) => {
    	// if ~~   next({path: /404}) 의 내용을 사용하였다 
        // 내가 지정한 쿼리값을 변조해서 사용하는걸 막기위한 가드였다
       // 처음에 사용할 때 함수가 비활성화 상태였는데 갑자기 됨... 오타있었나...뭔지모르겠따..
    },
    component: () => import("../views/home.vue")
    
}

 

아 추가로 컴포넌트 내부에서 router 사용할때  이번 프로젝트는 

vue3 setup + pinia 로 사용했었는데 

 

useRouter 임포트한다음에 useRouter() 를 통해서 라우터를 사용하였다 

컴포넌트 내부에서 실행하는 라우터는 좀 제한적인 부분이 있었다