Vue ルートがジャンプするときにユーザーがログインしているかどうかを判断する

ユーザーがログインしているかどうかを判断し、ログインしていない場合はログインルートにジャンプし、ログインしている場合は通常にジャンプします。この記事では主に、Vue ルーティングジャンプ時にユーザーがログインしているかどうかを判定する機能の実装について説明します。編集者はこれが非常に良いものだと思ったので、皆さんの参考として今から共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。

1 つ目: まず、ユーザーがログインしているかどうかを識別するために、ユーザーがログインする前と後のステータスを与えます (vuex を使用することをお勧めします)。わからない場合は、単に vuex を使用します。詳細については、公式 Web サイトにアクセスしてください。

import Vue from ‘vue‘
import Vuex from ‘vuex‘

Vue.use(Vuex);

var state = {
  isLogin:0,     //初始时候给一个 isLogin=0 表示用户未登录
};

const mutations = {
  changeLogin(state,data){
    state.isLogin = data;
  }

};

2 番目: ユーザーがログインするときにログイン ステータスを変更する

3 つ目は、ルート エントリにナビゲーション フックを追加することです。特定の意味のコード;

検証が必要なルートを設定します

 this.$store.commit(‘changeLogin‘,‘100‘)   
 //登录后改变登录状态 isLogin = 100 ；

2 番目のルート ジャンプして確認してください

{ path: ‘/admin‘, 
  component: Admin,
  meta:{auth:true} // 设置当前路由需要校验  不需要校验的路由就不用写了；不要问为什么，自己去看官网

  }

学習しましたか?皆さんのお役に立てれば幸いです。

関連する推奨事項:

携帯電話番号を取得するための WeChat アプレットの説明例 ログイン関数

ThinkPhp 検証コード ログイン関数の実装例

ThinkPHP のログインおよびログアウト関数コードの詳細説明

以上がVue ルートがジャンプするときにユーザーがログインしているかどうかを判断するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。