2017-11-04 1 views
1

게시물 및 댓글을 다루는 응용 프로그램에서 평탄하고 표준화 된 구조로 내 상태를 가능한 한 유연하게 유지하려고합니다. 특히 모든 게시물과 주석을 키 - 값 쌍으로 갖고 싶습니다. 여기서 키는 게시물 또는 주석의 ID이고 값은 게시물 또는 주석입니다. 즉, 내 상태는 다음과 같습니다.redux 상태에서 "보기"기능 포함

state = { 
    posts: new Map(), 
    comments: new Map() 
}, 

이 상태 구조는 대부분의 감속기 사례를 단순화합니다. 구성 요소에서하지만, 나는 반복적으로 게시물이나 의견의 배열을 얻기 위해 다음을 수행해야합니다 this.props.posts는 특정 구성 요소의 소품에 매핑 된 REDUX 상태의 게시물입니다

Array.from(this.props.posts.values()) 

.

관계형 데이터베이스의보기와 마찬가지로 마지막 코드 단편을 상태에 추가 할 수 있습니까? 시도했지만

state = { 
    posts: new Map(), 
    comments: new Map(), 
    postArray:() => { return Array.from(posts.values()) } 
}, 

하지만 작동하지 않는 것 같습니다.

답변

1

Redux 문서의 Structuring Reducers 섹션, 특히 Normalizing State Shape 섹션을 참조하십시오.

우리는 전형적인 정규화 된 상태 섹션 추천하기 추천해야하는 것이 좋습니다

users : { 
    byId : {}, 
    allIds : [] 
} 

당신은 또한 저장 상태의 데이터를 도출하는 과정을 캡슐화 memoized "selector" functions를 사용해야합니다.

또한 저는 개인적으로을 Redux 저장소의 정규화 된 데이터를 관리하기위한 추상화 계층으로 사용하는 것을 매우 좋아합니다. 내 "Practical Redux" tutorial series은 사용 방법을 보여줍니다.

React/Redux links listRedux Reducers and Selectors 섹션에서 리듀서, 선택기 및 정규화에 대한 추가 기사에 대한 링크가 있습니다.

1

상위 구성 요소를 사용하여 구성 요소를 랩핑하고 추가 소품을 삽입 할 수 있습니다. 간결한 방식으로이를 수행하기 위해 recompose 라이브러리의 withProps을 살펴볼 것을 제안합니다.

관련 문제