2016-06-23 2 views
1

우리는 Angular 2 앱에서 ngrx/store를 사용하고 있습니다. 우리 가게는 Reducers "cameraReducer", "subjectReducer" ...의 결합입니다 ... 그리고 우리는 몇 가지 글로벌 및 공통 (diff 기능을 통해) 항목을 "로드 데이터"와 같은 "appReducer" 속성을 유지하고 싶습니다.Angular2 - 감속기 간의 공유 작업이 나쁜 생각입니까?

이와 같은 시나리오에서 과 appReducer 사이에 {type:LOADING_*, payload}과 같은 동작을 공유하는 것이 합리적입니까? 단일 작동 (단일 감속기 및 단일 동작 사용) 또는 여러 관련 데이터 작업 (다중 감속기 및 다중 동작 사용)과 같이 생각할 수있는 기능이 시작되고 꺼지는 동안 기능이 켜져 있어야합니다 한 번 완료되었습니다. appReducer는 다음과 같이 표시 될 수 있습니다.

case LOADING_CAMERA: 
    LOADING_SUBJECT: 
      return state.setIn('loading') = true; 

Adv - No 상용구. 단점 - 인디케이터가 켜지거나 꺼지는 시점에 감속기의 순서가 결정됩니다. 온/오프 팝업 표시의 제어 주문 -

또는

case LOADING: 
     return state.setIn('loading') = true; 

우리는 각각의 기능을 호출

this.store.dispatch({action:'LOADING', payload: true}); 
//functionality 
this.store.dispatch({action:'LOADING', payload: false}); 

교수실의 시작/끝 부분에 다음과 같은 코드를 가질 수 있습니다. 단점 - 로딩을 켜고 끄는 상용구 코드.

또는

우리는 (각 감속기가 자신의 로컬 "로드"특성을 갖는 및 해당 속성의 관찰 가능한과) 결합 관찰 가능한로서 "로드"를 계산하기 위해 시도 할 수

.

Adv- 아니오 표시기 켜기/끄기에 대한 상용구 및 제어 주문. 단점 - 증가 된 복잡성과 더 많은 코드가있을 수 있습니다.

답변

2

Redux 저장소를 구성하는 일반적인 방법은 키마다 특정 종류의 도메인으로 데이터를 구성하고 해당 상태 조각에 대한 업데이트를 유지 관리하는 위임 된 책임을 부여하는 감속기 기능을 정의하는 것입니다. 일반적으로 combineReducers 유용. Redux는 동일한 수신 동작에 응답하는 여러 개의 하위 감속기 기능을 절대적으로 권장하므로 sliceAsliceB은 적절하게 독립적으로 업데이트됩니다. 각 하위 감속 기는 일반적으로 다른 주를 인식하지 않고 자체 슬라이스 업데이트에만 관심을 갖기 때문에 순서가 중요하지 않습니다. 관련 정보에 대해서는 Redux FAQ에서이 대답을보십시오 : http://redux.js.org/docs/FAQ.html#reducers-share-state.

0

효과를 사용할 수도 있습니다. 상태 변경이있을 때마다 트리거하는 StateUpdates의 변경 사항을 구독 할 수 있습니다. https://github.com/ngrx/example-app의 예제 응용 프로그램은 응용 프로그램과 ngrx를 구조화하는 방법에 대한 정보를 얻을 수있는 훌륭한 정보원입니다. LOAD_COLLECTION가 전달 될 때,이 배경 작업을 수행하고 구성 요소를 업데이트 LOAD_COLLECTION_SUCCESS를 전달하는라고 예를 들어

,

@Effect() loadCollection$ = this.updates$ 
    .whenAction(BookActions.LOAD_COLLECTION) 
    .switchMapTo(this.db.query('books').toArray()) 
    .map((books: Book[]) => this.bookActions.loadCollectionSuccess(books)); 

. 부작용이있는 불순한 기능은이 방법으로 가장 잘 작동하여 흡진기에 순수한 기능 만 남겨둔 것으로 보입니다.

관련 문제