VUE:vuexユーザ登録情報のデータ書き込みと取得方式


全体の考え:
フロントはユーザーデータを取得し、バックグラウンドにポスト要求を送信し、認証に成功したら
フロントでデータを受け取り、ユーザー登録状態を変更します。
ログイン状態とユーザデータをstateに書き込みます。
このように複数のページで直接にthis.store.getters.getunameを使ってstateのユーザ情報を呼び出すことができます。
1.バックグラウンドに要求を送り、ユーザー名、パスワードを返したら、this.store.dispatchを使う。stateにデータを書き込む
ページ:login.vue
コード:

 this.loginData = await getUserInfo(this.uname,this.pwd);
    console.log(this.loginData);
    if(this.loginData.res==1){
     this.$store.dispatch('setLogin', true);
     this.$store.dispatch('setAccount',this.loginData.obj.phone );
2.データをstateに書き込む
ページ:action.js
コード:

setAccount ({commit}, platform) {
 commit('SET_ACCOUNT', platform);
},
3.データをstateに書き込む
ページ:muttions.js
コード:

 SET_ACCOUNT (state, platform) {
   state.account = platform;
  },
4.取得stateにおける対応データの追加方法
ページ:getter.js
コード:

 getuname: (state) => state.account,
 homepage.vue   
5.this.$store.getters.getunameを使ってデータを調取する
ページ:login.vue
コード:

console.log( this.$store.getters.getuname)
以上のVUE:vuexユーザー登録情報のデータ書き込みと取得方法は、小編集が皆さんに共有しているすべての内容です。参考にしていただければと思います。よろしくお願いします。