VueはbeforeEachを使って登録状態チェック機能を実現します。


VueRouterのbeforeEachフック関数を使って、ナビゲーションがジャンプする前に登録状態をチェックする必要があります。
1.ログイン要求インターフェースの時にユーザーの情報を返します。例えば、userInfo:{userId:''123',userName:'小明')で、ログインが成功したらuserInfoをstoreに保存します。
2.beforeEachを使って登録状態検査を実現する

vueRouter.beforeEach((to, from, next) => {
  //store getters             getUser
  //userId         
  let isLogin = store.getters.getUser.userId;
  if (!isLogin) {//   
    if (to.path !== '/login') {//      
      return next({path: '/login'});
    }else {
      next();
    }
  }else {//   
    if (to.path === '/login') {//     
      return next({path: '/index'});
    }
    next();
  }
});
ログインを終了するには、storeに保存されているユーザ情報を空にしておくだけでいいです。
以上のこのVueはbefore Eachを使って登録状態の検査機能を実現しました。小編集は皆さんに全部の内容を共有しています。参考にしてもらいたいです。どうぞよろしくお願いします。