技術標籤：nuxt伺服器渲染vue.js

nuxt---store篇

• nuxt-store目錄介紹
  store目錄:store目錄包含您的Vuex store檔案。Vuex Store自帶Nuxt.js，但預設禁用。在此目錄中建立index.js檔案啟用該儲存。
  官方文件

• nuxt中vuex的配置

const store =  new Vuex.Store({
     state : () => ({
        //存放資料
        token: getToken(),
    }),
     getters : {
        token: state =>
 
 state.token  
    },
    
     mutations : {
      處理同步函式
      SET_TOKEN: (state, token) => {
            state.token = token
            console.log(state.token);
          }
    },
     actions : { 
     //處理非同步函式
      // 登入
         QQlogin({ commit },token) {    
          return new Promise((
 
resolve, reject) => {
              setToken(token);         //把token存放到cookie裡
              commit('SET_TOKEN',token)     //commit呼叫mutations 資料 
              resolve()
    
          })
        }
    }
    
})


export default () =>{
    return store          //這裡要強調 暴露出去是一個函式 
}

• 在其他頁面的應用

//store暴露的是一個函式     store() 
 

//任意頁面
import store from '~/store/index' 

created(){
   this.$store.dispatch('QQlogin','15313213332');  //自己傳一個引數
    let token = store().getters.token            
    console.log(token);
    
  },

store目錄無需配置(約定式),可有可無,需要自己建立(但名稱不能亂改,只能叫store),建立index.js會自動觸發屬性

~喜歡 的小夥伴點個讚唄，謝謝♥~

相關推薦:橘子貓哥的《普歌-飛靈團隊-Vue基礎整理(上部分)》

作者：橘子貓哥
出處/源自：橘子貓哥《普歌-nuxt踩坑記(一)------store篇》

本文版權歸作者和CSDN共有，歡迎轉載，且在文章頁面明顯位置給出原文連結，未經作者同意必須保留此段宣告，否則保留追究法律責任的權利。