vue项目逻辑梳理

vue 发送请求,一般使用vuex.
首先找到仓库文件 store.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);

import orderlist      from './store/orderlist/store.js';
export default new Vuex.Store({
  modules: {
      "ORDER_LIST":     orderlist,
      "DETAIL":         detail,
      "detailVirtual":  detailVirtual,
      "detailEvoucher": detailEvoucher
  }
})

下面看一下 ./store/orderlist/store.js 这个文件


function cancleOrder({ commit }, paramsWrapper) {
 // 发送请求
  return CommonGateWay.proxy(URL.CANCLE_ORDER, paramsWrapper);
}
const action = {
  cancleOrder
};
const state = {
   orderList: null,
    totalNum: 0,
    numPerPage: 20,
};
const mutations = {
  update_orderlist (state, vo) {
        state.orderList = [];
        state.orderList = vo;
    },
};
const getters = {
};
//千万别忘记设置命名空间
export default {
    namespaced: true,
    state,
    mutations,
    actions,
    getters
}

当我们发送一个请求的时候,就写以下代码

     let params = {  //配置查询参数
                    "vue": this,
                    "params": {}
                }

                let _action = "ORDER_LIST/cancleOrder";

                this.$store.dispatch(_action, params).then(rep=>{
                     console.log("请求成功")
                     console.log(rep)
                },err=>{
                  console.log("请求失败")
                });

你可能感兴趣的:(vue项目逻辑梳理)