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


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM