복잡한 개체에 대한 Vuex 모범 사례

복잡한 개체에 대한 Vuex 모범 사례

내 Vuex 스토어에는 다양한 복잡성을 가진 물체가 있다.어떤 것들은 중첩된 물체를 가지고 있고, 어떤 것들은 중첩된 물체의 배열들을 가지고 있다.

다음과 같은 선에 따라 지정된 속성을 변이하는 일반 함수를 만들 수 있다.

setProperty(state,{ type, id, prop, value })
{
  state[type][id][prop] = value;
}

하지만 중첩된 개체, 즉 개체들의 배열은 금방 복잡해질 것이다.또한 내포되거나 다른 방법으로 모든 단일 객체 특성에 대해 돌연변이를 생성해야 하는 것은 매우 지루해 보인다.

개체, 중첩 개체, 배열 등을 수정하기 위한 돌연변이를 생성하는 모범적 실무 지침은?

또 다른 관련 이슈는 물체를 주에서 찾아보는 것과는 반대로, 물체를 돌연변이로 옮기는 것이 나쁜 형태로 간주된다는 점이다.

setProperty(state,{ obj, prop, value })
{
  obj[prop] = value;
}

일반적으로 말해서, 애초에 중첩된 상태 구조를 피할 수 있다면 가장 좋다.당신의 데이터가 어떻게 구성되어 있는지 잘 모르겠지만, 만약 당신이 그 개체나 개체 영역 사이에 관계가 있기 때문에 그렇게 하고 있다면, 그것은 국가 형태를 정상화하는 것을 시도해 볼 가치가 있을 것이다.

여기 Redex 작가의 좋은 기사가 있다.Redex에 대해 이야기하고 있지만 핵심 개념은 Vuex에 대해 매우 동일하다.https://redux.js.org/docs/recipes/reducers/NormalizingStateShape.html

그리고 Vues ORM은 당신을 위해 자동으로 그것을 하는 도서관이다.

참조URL: https://stackoverflow.com/questions/43596031/vuex-best-practices-for-complex-objects