IT이야기

Vuejs 2의 특정 경로로 이동

cyworld 2022. 3. 15. 20:47
반응형

Vuejs 2의 특정 경로로 이동

나는 VueJS에 처음 와, VueJS 2 웹팩 템플릿을 사용하고 있어.로그인 성공 시 로그인 컴포넌트에서 홈 컴포넌트로 리디렉션하려고 했는데, 여러 가지 시도를 해봤지만 여전히 오류가 발생하고 있어.여기 내 라우팅이 있다.

const router = new VueRouter({
  mode: 'history',
  routes: [{
    'name': 'home',
    path: '/',
    component: require('./components/Home.vue'),
    beforeEnter: (to, from, next) => {
      if (!localStorage.getItem('user')) {
        next('/login')
      }
    }
  }, {
    'name': 'profile',
    path: '/profile',
    component: require('./components/Profile.vue'),
    beforeEnter: (to, from, next) => {
      if (!localStorage.getItem('user')) {
        next('/login')
      }
    }
  }, {
    'name': 'login',
    path: '/login',
    component: require('./components/Login.vue')
  }, {
    'name': 'new',
    path: '/new',
    component: require('./components/New.vue'),
    beforeEnter: (to, from, next) => {
      if (!localStorage.getItem('user')) {
        next('/login')
      }
    }
  }, {
    'name': 'signup',
    path: '/signup',
    component: require('./components/Signup.vue')
  }, {
    'name': 'logout',
    path: '/logout',
    beforeEnter: (to, from, next) => {
      localStorage.removeItem('user')
      next('/login')
    }
  }, {
    'name': 'article',
    path: '/article/:id',
    component: require('./components/Article.vue'),
    beforeEnter: (to, from, next) => {
      if (!localStorage.getItem('user')) {
        next('/login')
      }
    }
  }]
})

그리고 그것이 내가 홈 컴포넌트로 리디렉션하려고 했던 것이다.

this.$router.replace(this.$router.go('/'))

그리고 나는 이런 오류를 얻었다.

Uncaught (in promise) TypeError: Cannot read property 'name' of undefined(…)

this.$router.replace()입지를 기대하다

this.$router.go('/')브라우저 기록을 통해 이동하므로 실제로 아무것도 반환하지 않아야 한다.본질적으로 그런 것이다.window.history.go(Number).

하고 싶을 것 같다.this.$router.replace('/')현재 사용 중인 페이지를 바꾸십시오.

그리고. 이 부분은 서류에서 확인해 볼게.반복 코드를 많이 넣을 수 있다.beforeEach.

https://router.vuejs.org/en/advanced/meta.html

참조URL: https://stackoverflow.com/questions/41166328/go-to-a-specific-route-in-vuejs-2

반응형