IT

Vuex에서 작업으로 개체 전달 문제

itgroup 2023. 7. 7. 18:57
반응형

Vuex에서 작업으로 개체 전달 문제

Vuex 작업에 개체를 전달하려고 하는데 작동하지 않는 것 같습니다.

이 작업은 개체를 가져와서 개체를 반복하고 API 끝에 있는 문자열을 출력하여 결과를 필터링합니다.

내 구성 요소:

  data() {
    return {
      usersData: [],
      modals: {
        removeUser: false,
        id: "",
        filterSearch: false
      },
      filters: {
        role: "user",
        active: "true",
        search: "",
        pageSize: "",
        page: ""
      }
    };
  },
  mounted() {
    this.getUsers();
  },
  methods: {
    getUsers() {
      console.log("object before passed = " + this.filters);
      var params = this.$store.dispatch('getQueryString', this.filters);
    }
  }

store.js

import Vue from "vue";
import Vuex from "vuex";
import axios from "axios";

Vue.use(Vuex);
Vue.use(axios);

export default new Vuex.Store({
  state: { },
  mutations: { },
  actions: {
    getQueryString(payload) {
      console.log("object passed = " + payload);
      let paramString = "";
      let counter = 0;
      for (var key in payload) {
        if (payload[key]) {
          let connector = (counter > 0) ? "&" : "?";
          paramString += connector + key + "=" + payload[key];
          counter++;
        }
      }
      return paramString;
    }
  },

콘솔에서 출력하면 다음과 같이 표시됩니다.object before passed = [object Object]그래서 나는 객체가 행동에 전달되기 전에 문제가 있다는 것을 알고 있습니다.Vue는 개체를 문자열로 출력하는 것처럼 보이지만 이 구성 요소 내에서 개체처럼 작동합니다.

이 작업에 개체를 제출하는 방법을 아는 사람이 있습니까?

대신에console.log("object passed = " + payload)사용하다console.log("object passed = ", payload)그리고 당신은 당신의 목적을 봐야 합니다.사용하다payload.filters페이로드 안에 있는 당신의 물건을 읽습니다.

언급URL : https://stackoverflow.com/questions/58268842/trouble-passing-an-object-to-an-action-in-vuex

반응형