분할 리 듀서

Question

제 질문은 제 감속기를 구성하는 방법에 관한 것입니다. 이제 우리는 장소에 하나의 감속기가 있다고 가정 해 봅시다 시작으로

resources: [ 
    { 
     id: 1, 
     name: "John", 
     /* ... 100 more properties ... */ 
    }, 
    { 
     id: 1, 
     name: "Daniel", 
     /* ... 100 more properties ... */ 
    }, 
] 
events: { 
    planned: [ 
     { 
      resourceId: 1, 
      name: "Concert with Adele", 
      /* ... 100 more properties ... */ 
     } 
    ] 
} 

:

내가 이런 상태의 모양을 가지고 있다고 할 수 있습니다. 비즈니스 로직은 다음과 같습니다.

1. 언제든지 리소스를 추가하고 제거 할 수 있습니다.
2. 리소스가없는 이벤트가있는 경우 첫 번째 리소스가 이벤트에 추가됩니다.
3. 리소스가있는 이벤트가 있고 리소스가 제거되고 다른 리소스가없는 경우 resourceId가 설정되지 않습니다.
4. 리소스가있는 이벤트가 있고 리소스가 제거되고 다른 리소스가있는 경우 resourceId는 나머지 리소스 중 첫 번째 리소스로 설정됩니다.

상태 트리의 "자원"분기를 처리 할 수있는 장소에 로직이 많이이며, 동시에 국가 트리의 "이벤트"부분을 처리 할 수있는 장소에 많은 로직이있다.

포인트 2,3,4는 "자원"과 "이벤트"사이의 종속성을 소개합니다. 가능한 한 최선의 방법으로 해결하려고합니다.

나이브 솔루션

순진 솔루션은 모든 작업을 처리 할 수있는 하나의 감속기를하는 것입니다. 이런 식으로 리소스가 제거되면 리소스를 제거하고 리소스가 남아 있는지 확인한 다음 그에 따라 이벤트를 업데이트 할 수 있습니다. 그러나 '자원'과 '사건'에 대한 논리를 함께 유지하는 것은 좋지 않다고 느끼기 때문입니다.

두 개의 서로 다른 감속기에 자원 및 이벤트의 처리를 분할하는 것입니다 자신의 목록을

또 다른 대안을 유지한다. 상태 트리의 이벤트 부분에서 사용 가능한 resourceIds 목록을 유지하여 이벤트를 업데이트하는 방법을 알 수 있습니다. Resource reducer와 동일한 이벤트를 계속들을 수 있지만 관련 데이터 만 저장하면됩니다.

resources: [ 
    { 
     id: 1, 
     name: "John", 
     /* ... 100 more properties ... */ 
    }, 
    { 
     id: 2, 
     name: "Daniel", 
     /* ... 100 more properties ... */ 
    }, 
] 
events: { 
    resourceIds: [1,2], /* ADDED: Keeping track of available resources */ 
    planned: [ 
     { 
      resourceId: 1, 
      name: "Concert with Adele", 
      /* ... 100 more properties ... */ 
     } 
    ] 
} 

프록시 작업

같은 뭔가가 세 번째 옵션은 REMOVE_RESOURCE의 행동에 대한 (예를 REDUX-사가에에) 리스너를 작성 한 다음, 현재 기본 포함됩니다 다른 액션 UPDATE_DEFAULT_RESOURCE_ID 발생하게됩니다 리소스 ID.

올바른 접근 방법에 대한 의견이 있으십니까?

Answer 1

나는 개인적으로 ducks에 내 코드를 분할하고 옵션 2에 명시된대로 정규화 된 상태를 사용하고 싶습니다. 두 개 이상의 reducers와 관련된 복잡한 논리를 수행해야 할 때마다 세 번째 옵션에서 언급 한대로 redux-saga을 사용합니다 .

이렇게하면 "인터 듀서 (inter reducers)"논리가 분리되고 사가 (sagas)를 통해 더 쉽게 테스트 할 수 있습니다. 또한 duck circle으로 끝날 수도 없습니다.일반적으로

, 종종 가난한 디자인의 강한 신호 의존도는 원을 볼 때.

Answer 2

이벤트를 업데이트하는 작업은 리소스 감속기를 사용하므로 종속성을 유지하면서 두 이벤트의 관심사를 구분합니다.

event_reducer(state, action) { 
    switch(action.type) { 
    case 'REMOVE_RESOURCE_FROM_EVENT': 
     return {...state, resource_id: resource_reducer(null, action)} 
    } 
} 

resource_reducer(state, action) { 
    switch (action.type) { 
    case 'REMOVE_RESOURCE_FROM_EVENT': 
     let id = null; 
     if (resources.length > 0) { 
     id = resources[0].id; 
     resources = resources.slice(1); 
     } 
     return id; 
    } 
}