programing

배열 정렬 시 게이터를 올바르게 사용하는 방법

prostudy 2022. 5. 21. 08:53
반응형

배열 정렬 시 게이터를 올바르게 사용하는 방법

그래서 나는 vuex getter를 사용하는 데 문제가 있어.

내 목표는 그 사람들을 분류하는 것이다.cart다음에 의한 객체 배열인 데이터date게터 사용myCartItems

내 문제는 두 번째 적재물을 밀어서{prod_id: 2, date: Wed Nov 03 2021 10:40:20}나의Details구성 요소 로깅 중인 소품['prod_id']prod_id: 1대신에prod_id: 2

돌연변이

addToCart: (state, payload) => {
  state.cart.push(payload) // payload = {prod_id: 1, date: Wed Nov 03 2021 10:37:26}
}

줍는 사람들

 cartItems: (state) => {
   return state.cart.slice().sort(
      (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime()
    );
 },

html

  <div v-for="(item,index) in cartItems" :key="index">
       <Details :id="item.prod_id" />
  </div>

인덱스를 다음으로 사용key색인은 정렬 순서에 따라 절대 변경되지 않기 때문에 문제가 될 수 있다.

예를 들어 고유 식별자를 사용하는 것이 가장 좋은 방법이다.prod_id

<div v-for="item in cartItems" :key="item.prod_id">
  <Details :id="item.prod_id" />
</div>

참조URL: https://stackoverflow.com/questions/69819120/how-to-properly-use-getters-when-sorting-array

반응형