首页 > 解决方案 > 将状态数据从 store 访问到字符串 vue.js

问题描述

嘿伙计们,所以我正在尝试将我的商店中的状态数据添加到我的一个 axios 调用中的一个字符串中。这是我的商店:

export const store = new Vuex.Store
({
  state: {
    participants: [],
    filterTags: ["foo", "swag"],
    page: 1,
    perPage: 2,
    filterTagName: "",
   }
}

这是我的行动呼吁:

 actions: {
async loadParticipants ({commit}) {
  try {
    console.log(this.state.page);
    await axios
  .get('/dash/participant?perPage=2&page=1&string=f')

      .then(r => r.data)
      .then(participants => {
        console.log(participants.docs);
        console.log("Hit me");
        commit('setParticipants', participants)
      })
  }
  catch (e) {
    if (e.response)
      console.log(e.response);
    throw e
  }
}

我想在 axios 调用中添加商店的状态数据 { INSERT DATA HERE } :

 .get('/dash/participant?perPage={INSERT DATA HERE }&page={ INSERT DATA HERE }&string=f')

任何输入表示感谢,谢谢!

标签: stringvue.jsaxiosvuex

解决方案


({commit})在您的操作中,您可以访问整个商店,因此您也可以添加状态,而不是仅获取将参数声明为的提交:

async loadParticipants ({commit, state}) {

因此,您可以state在方法主体中使用该变量:

actions: {
  async loadParticipants ({commit, state}) {
    try {
      console.log(this.state.page);
      await axios
    .get(`/dash/participant?perPage=${state.perPage}&page=${state.page}&string=${state.filterTagName}`)

        .then(r => r.data)
        .then(participants => {
          console.log(participants.docs);
          console.log("Hit me");
          commit('setParticipants', participants)
        })
    }
    catch (e) {
      if (e.response)
        console.log(e.response);
      throw e
    }
  }
}

推荐阅读