vuex获取数据三连环

1.向服务器发起ajax请求，

请求地址：XX/XXX

请求方式：GET||POST

2.获取购物车数据，操作VueX三连环，组件获取数据，展示数据

对axios进行二次封装

1.去index.js请求接口

//get请求方式
    export const reqCartList = ()=>requests({url:'/XXX/XXX',method:'get'})

//post请求方式（带参数）
    export const reqAddOrUpdateShopCart = (skuId,skuNum)=>requests({url:`/XXX/XXX/${ skuId }/${ skuNum }`,method:'post'})

2.去仓库存数据

-store创建新的小仓库

-store的index.js大仓库中引入小仓库

3.在小仓库中进行数据获取，state存取数据，mutation操作state,action是获取数据的方法后携带数据提交给mutation

-mutaion只能执行同步任务，改变state的值

-action可以执行异步任务

3.去组件捞数据

-this.$store.dispatch('getCartList'); 调用Store中的getCarList方法

-dispatch是异步操作下

//异步
this.$store.dispatch('getlists',name)
//取值
this.$store.getters.getlists

-commit是同步操作下

//同步
this.$store.commit('changeValue',name)
//取值
this.$store.getters.getlists

这时候就可以在Vuex中看到我们已经拿到GETCARTLIST里的数据了，接下来就是捞有用的数据

//引入vuex中的getter到的数据
import {mapGetters} from 'vuex'

//在computed中获取数据
 computed:{
      ...mapGetters(['cartList']),
      cartInfoList(){
        return this.cartList.cartInfoList||[];
      }
    }

//OR 利用mapstate将数据从库中引入

import {mapState} from 'vuex'

computed:{
      ...mapState({
        addressInfo:state=>state.trate.address,
        orderInfo:state=>state.trate.address
      })
    },