programing

Vuex의 mapGetters에 매개 변수 전달

firstcheck 2022. 7. 29. 22:43
반응형

Vuex의 mapGetters에 매개 변수 전달

좋은 하루 되세요.

vue.js 프로젝트에서 모듈을 사용합니다.이제 getter에서 필터링된 데이터를 가져와야 하는데, 테스트하지 말고 어떻게 매개 변수를 제공하는지 확인하십시오.

Getter에 'name' 파라미터를 제공하고 싶습니다.Component.vue에서는 어떻게 할 수 있습니까?

/*State in vuex*/
state: {
   tempMessageValues: [
            { name: 'RU', status: 'none', selected: false },
            { name: 'BY', status: 'none', selected: false },
            { name: 'KG', status: 'none', selected: false }
        ]
}

/*Getters*/

import * as types from '../types';

export default {
    [types.GETTERS.TEMP_MESSAGE_VALUES]: state => {
        return state.tempMessageValues.find(country => country.name === name);
    }
};

/*Types*/

export const GETTERS = {
    TEMP_MESSAGE_VALUES: 'shared/TEMP_MESSAGE_VALUES'
};

/*Code in Component.vue*/

import * as types from "./store/types";
import { mapGetters } from "vuex";

export default {
  computed: {
    ...mapGetters({
      getTempMessValues: types.GETTERS.TEMP_MESSAGE_VALUES
    })
  }
};

의사들은 카레를 사용하여 패럴럼을 게터에게 전달할 것을 제안합니다.

export default {
  [types.GETTERS.TEMP_MESSAGE_VALUES]: state => name =>
    state.tempMessageValues.find(country => country.name === name)
};

그 예에 대해서는, https://vuex.vuejs.org/guide/getters.html#method-style-access 를 참조해 주세요.즉, 게터가 함수를 처음 호출했을 때 반환하도록 하는 것입니다.

이해 하셨나요?

한 가지 방법은 getter에서 함수를 반환하는 것입니다.이 함수를 사용하여 파라미터를 전달할 수 있습니다.

export default {
[types.GETTERS.TEMP_MESSAGE_VALUES]: state => {
    return (name) => state.tempMessageValues.find(country => country.name === name);
}
};

이제 함수를 호출하여 파라미터를 getter에 전달할 수 있습니다.

this.getTempMessValues('YourValue')

언급URL : https://stackoverflow.com/questions/52646665/pass-params-to-mapgetters-in-vuex

반응형