關於vuex與v-route的結合使用

把vue實際用於項目的過程當中遇到過一些問題

1.如何將vuex和vue-route結合使用（接口調用成功回調頁面這類等等）

   1.初始考慮的方法是在vuex引入vue-router，vuex寫一些業務邏輯代碼，當接口處理完畢以後經過vue-route來處理頁面。

     當時這種方式耦合性過高，不推薦使用。vuex應該處理數據相關的操做，不該該處理界面層的事情。

 

   2.經過Promise的方式，比較推薦這種方式。在vuex裏面返回Promise，頁面層經過Promise來處理頁面相關的操做，代碼以下

  actions: {
    activitySetOrModifyManage({commit}, param){
      console.log(param);
      return new Promise((resolve, reject) => {
        axios.post(baseUrl.activitySetManageUrl, qs.stringify(param))
          .then(function (response) {
            console.log(JSON.stringify(response.data));
            let data = response.data;
            if (data.code == 200) {
              resolve();
            } else {
              reject()
            }
          })
          .catch(function (error) {
            console.log(error);
            reject()
          });
      });

    },

 

this.activitySetOrModifyManage(param).then(
      ()=>{
          console.log('接口調用成功，編程改變路由')
          this.$router.push({ path: '/activityList' })
        },
      ()=>{
         console.log('接口調用失敗')
       }

);

     在回調的Promise裏面能夠處理不少事情，關於頁面層的事情均可以在這裏處理。邏輯業務所有剝離放在vuex裏面，下降耦合性。