javascript - Plusieurs requêtes Axios en même temps, les données sont écrasées par la requête précédente, comment résoudre ce problème?

Question

Plusieurs requêtes axios en même temps, les données sont écrasées par la requête précédente, comment le résoudre ?
L'utilisation d'axios.all peut résoudre le problème, mais vous ne pouvez pas toujours ajouter une méthode all à chaque fois, ce qui n'est pas pratique
configuration axios

import axios from 'axios'
import store from '../vuex/'
import { Notification } from 'element-ui'
// import router from '../routers'
// axios 配置
axios.defaults.timeout = 10000
axios.defaults.baseURL = '/api/'
// http request 拦截器
axios.interceptors.request.use(config => {
  if (store.state.token) {}
  return config
}, err => {
  return Promise.reject(err)
})

// 后台无返回success因此修改之前的拦截器规则，直接返回数据
// http response 拦截器
axios.interceptors.response.use(response => {
  console.log(response)
  if (response.data.status === 200 || response.data.code === 200) {
    return response.data.data
  } else {
    Notification.error(response.statusText)
    return response.data
    // return Promise.reject(response.statusText)
  }
})
export default axios

Configuration de l'API (il existe plusieurs API comme suit, pas toutes publiées)

// 1. 产品系列 :: 列表
export const getProductType = params => {
  return axios.get(`/product/type/list`, params)
}

Appelez vuex sur la page

  store.dispatch('getProductStatus')
  store.dispatch('getProductStyle')
  store.dispatch('getProductType')

configuration vuex

import {getProductStyle, getProductStatus, getProductType} from '@/http/api'
const state = {
  panelIsShow: false,
  dict: {
    statusDict: [],
    styleDict: [],
    typeDic: []
  }
}
const mutations = {
  SET_PANEL_SHOW (state, data) {
    state.panelIsShow = data
  },
    // 获取产品募集状态字典
  GET_DICT_STATUS (state, dict) {
    state.dict.statusDict = dict
  },
  // 获取产品风格字典
  GET_DICT_STYLE (state, dict) {
    state.dict.styleDict = dict
  },
  // 获取产品系列字典
  GET_DICT_TYPE (state, dict) {
    state.dict.typeDict = dict
  }
}
const actions = {
  // 产品风格
  async getProductStyle ({commit}) {
    let data = await getProductStyle()
    commit('GET_DICT_STYLE', data)
  },
  // 产品募集状态
  async getProductStatus ({commit}) {
    let data = await getProductStatus()
    commit('GET_DICT_STATUS', data)
  },
  // 产品系列
  async getProductType ({commit}) {
    let data = await getProductType()
    commit('GET_DICT_TYPE', data)
  }
}
const getters = {
  panelIsShow: state => state.panelIsShow,
  dict: (state) => state.dict
}
export default {
  state,
  getters,
  actions,
  mutations
}

Answer 1

Pas question.

Publiez le code.

Cette façon d'écrire sera certainement couverte

Answer 2

Si vous n'utilisez pas la méthode all, vous ne pouvez bien sûr pas garantir la commande et les données seront bien sûr écrasées.