IT이야기

Vue JS(router.BeforeEach) 예외를 문자열로 변환하지 못함

cyworld 2022. 5. 6. 19:48
반응형

Vue JS(router.BeforeEach) 예외를 문자열로 변환하지 못함

사용하려고 한다.router.beforeEach와 함께localStorage. 데이터가 있는 경우localStorage나는 홈페이지를 건너뛰고 싶다.데이터가 없으면 홈페이지를 입력한다.다음과 같이 데이터를 인쇄할 수 있다.console.log, 그러나 라우터 프로세스가 실패함

경로 탐색 중 [vue-properties] 검색되지 않은 오류 > 예외를 문자열로 변환하지 못함

내비게이션을 제어하려면 어떻게 해야 하는가?

나의router.js:

Vue.use(Router);

const router = new Router({
    routes: [{
            path: '/',
            name: 'index',
            components: {
                default: Index,
                header: MainNavbar
            },
            props: {
                header: {
                    colorOnScroll: 400
                }
            }
        },
        {
            path: '/landing',
            name: 'landing',
            components: {
                default: Landing,
                header: MainNavbar,
                footer: MainFooter
            },
            props: {
                header: {
                    colorOnScroll: 400
                },
                footer: {
                    backgroundColor: 'black'
                }
            }
        },
        {
            path: '/login',
            name: 'login',
            components: {
                default: Login,
                header: MainNavbar
            },
            props: {
                header: {
                    colorOnScroll: 400
                }
            }
        },
        {
            path: '/profile',
            name: 'profile',
            components: {
                default: Profile,
                header: MainNavbar,
                footer: MainFooter
            },
            props: {
                header: {
                    colorOnScroll: 400
                },
                footer: {
                    backgroundColor: 'black'
                }
            }
        }
    ],
    scrollBehavior: to => {
        if (to.hash) {
            return {
                selector: to.hash
            };
        } else {
            return {
                x: 0,
                y: 0
            };
        }
    }
});

router.beforeEach((to, from, next) => {
    let adres = JSON.parse(localStorage.getItem('adres'));
    if (!adres) {
        next('/');
    } else {
        next('/login');
    }
});

export default router;

로컬 데이터 예:

{  
   "id":1,
   "adi":"Demo",
   "soyadi":"Sef",
   "telefon":"05322375277",
   "adres":"Girne Mahallesi 6022 Sk. No:22 Kahta/Adıyaman",
   "fotograf":"http://localhost:8000/media/kullanici/sef/demosef/chef-1.jpg"
}

당신은 무한한 루프를 만들고 있다.beforeEach경비원이 계속 계발되거든에서beforeEachlocalStorage에 주소가 있는지 확인하고 다음 중 하나로 리디렉션함/또는/login다시 한번 새로운 경로로 들어가기 전에beforeEach호출되어 주소가 있는지 확인하고 리디렉션하십시오.그 과정은 반복된다.전화해야 한다.next()당신의 어딘가에 아무런 매개 변수 없이.beforeEach정상 항법 확인을 위해 보호한다.그래서 당신은 이런걸 하고 싶을지도 모른다.

router.beforeEach((to, from, next) => {
  if (to.path == '/') {  // If we are entering the homepage.
    let adres = JSON.parse(localStorage.getItem('adres'));
    if (!adres) {
      next();
    } else {
      next('/login');
    }
  } else {  // Not entering the homepage. Proceed as normal.
    next()
  }
});

참조URL: https://stackoverflow.com/questions/52913361/vue-js-router-beforeeach-failed-to-convert-exception-to-string

반응형