关于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里面，降低耦合性。