The vuex warehouse requests the requested data and then obtains the data from the component.

The vuex warehouse requests the requested data and then obtains the data from the component.

First, write the request data in the vuex warehouse
import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
Vue.use(Vuex)

export default new Vuex.Store({
    
    
  state: {
    
    
    cartListGet: []
  },
  mutations: {
    
    
    // 加入购物车数据
    GETDATACART(state, pylaod) {
    
    
      state.cartListGet = pylaod
      console.log(state.cartListGet)
    }
  },
  actions: {
    
    
    // 请求购物车数据
    getCartList(conText, pylaod) {
    
    
      axios({
    
    
        url: 'http://localhost:8081/wx/cart/index',
        headers: {
    
    
          'X-Litemall-Token': localStorage.getItem('X-Litemall-Token')
        }
      }).then(res => {
    
    
        // console.log(res.data.data)
        if(res.status === 200) {
    
    
          // conText就等于$store  commit当要修改的时候 
          conText.commit('GETDATACART', res.data.data.cartList)
        }
      })
    }
  },
})

After requesting, write like this when you want to get data from the component
mounted() {
    
    
    // 当仓库请求到的数据 想要获取仓库请求到的数据 这个地方要这样做
    this.$store.dispatch('getCartList')
    this.cartGetList = this.$store.state.cartListGet
    // console.log(this.cartGetList)
}

Supongo que te gusta

Origin blog.csdn.net/qq_53135313/article/details/129306650
Recomendado
Clasificación