Array .find() 메서드 매개 변수가 vuex에 정의되지 않았습니다.

Array .find() 메서드 매개 변수가 vuex에 정의되지 않았습니다.

저는 그것 때문에 어려움을 겪고 있습니다..find()메서드가 vuex getter에 있습니다.

상태의 목록(페이지)으로 스토어를 설정했습니다.

// state.js
const state = {
  pages: [{id:1, content:"Page 1"}, {id:2, content:"Page 2"}]
};

그리고 이 게시물과 같은 찾기 방법을 가진 게터: 참조.

// getters.js
const getters = {
  indexPage: state => {
    let indexPage = state.pages.find(function(page) { // same error with arrow function
      return page.id === 1;
    });
    return indexPage !== undefined ? indexPage : null;
  }
}

첫 번째 개체를 반환할 것으로 예상했지만 구성 요소에서 getter(mapGetters)를 매핑한 후 이 오류가 발생합니다.

TypeError: "page is undefined"

또한 저는 같은 코드를 시도했습니다..filter()메서드(어레이를 반환함)이지만 오류 없이 작동합니다.이 코드는 작동합니다.

const getters = {
  indexPage: state => {
    let indexPage = state.pages.filter(page => page.id === 1);
    return indexPage[0];
  }
}

사용해 보십시오.

const getters = {
  indexPage: state => page => state.pages.find(p => p.id === page)
}

업데이트: 맵게터 사용

const store = new Vuex.Store({
  state: {
    pages: [
      {id:1, content:"Page 1"}, 
      {id:2, content:"Page 2"}
    ]
  },
  getters: {
    indexPage: state => page => state.pages.find(p => p.id === page)
  }
})

const mapGetters = Vuex.mapGetters

new Vue({
  el: '#app',
  store,
  mounted () {
    console.log(this.indexPage(1))
  },
  computed: {
    ...mapGetters([
      'indexPage'
    ])
  }
})

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://unpkg.com/vuex"></script>
<div id="app"></div>

언급URL : https://stackoverflow.com/questions/59462748/array-find-method-parameter-undefined-in-vuex