2017-01-28 7 views
2

React Redux 프로젝트에서 구성 요소 Item은 구성 요소 ProductCategory에 대한 봉쇄 역할을합니다. Item은 항상 클릭 이벤트를 수신해야하지만 포함 된 내용에 따라 이벤트를 다르게 처리해야합니다. Product이 포함 된 경우 Category이 포함 된 경우 ADD_TO_CARTOPEN을 전달해야합니다.React Redux : 커튼 작업 정의 위치에 대해 혼동이 있음

현재 비동기 API 요청을 처리하는 제품 및 카테고리에 대한 액션 제작자가 redux-thunkaxios입니다. OPENADD_TO_CART은 이러한 액션 크리에이터의 일부가되어야합니까, 아니면이 기능이 보드의 액션 크리에이터에 속해야합니까? 그리고 어떤 감속기가 이러한 행동을 처리해야합니까?

답변

1

이 질문은 당신이 당신의 감속기의 구조를 언급하지 않는 당신이 의미에서 제공하는 현재의 범위를 넘어, 그러나 어떤 경우의 부품으로 가자 :

해야 OPEN 및 ADD_TO_CART 이러한 액션 크리에이터의 일원이거나 이 기능이 보드의 액션 크리에이터에 속해 있습니까?

나는 완전히 당신이 board's 행동 작성자가 뜻을 이해하지 않지만, 나는 그것이 그들이 하나의 창조자와 결합하는 경우의 행동에 대해 추론하기 위하여 훨씬 더 간단하다 생각 예 :

function addToCart(item) { 
    return dispatch => dispatch({type: ADD_TO_CART, item}) 
} 

서로 다른 제작자가 동일한 작업을 수행하는 것보다 디버그하기가 더 어려워집니다. 어떤 제작자가 어떤 작업을 파견했는지 완전히 알지 못할 수도 있으므로 내 제안은 1 명의 제작자 -> 1 가지 작업입니다.

동시에 작업 작성자를 구성 요소에 연결할 때 런타임에 코드를 디버깅 할 필요가 없도록 가능한 한 명확하게 작업을 유지하십시오 (예 :

).
if(this.props.isItem) { 
    this.props.addToCart(this.props.item); 
} else { 
    this.props.open(this.props.category); 
} 

코드는 자명하며 런타임에 이상한 동작을 방지합니다.

이러한 감속기는 어떤 조치를 취해야합니까?

을 :

이것은 단지 내가 당신의 이경 현재의 구조를 알고 있지만, 일반적으로 항상 어려운 적합한 아키텍처를 선택하지만, 일반적인 지침으로 내가 말을하지 않기 때문에, 훨씬 강하다는 질문

Always split your reducers to sub-domains of your problem 

OPEN이라는 액션이 ​​있는데 실제로 뷰어 모델로 축소 기 (reducers)를 사용하고 있다고 생각하게됩니다. 그러나 이것은 구현 세부 사항에도 달려 있습니다.

View reducers는 내 의견으로는 매우 유용하지만 한 가지주의해야 할 점은 OPEN 조치가 있다면 상품 정보뿐만 아니라이 감속기에 애플리케이션 뷰의 상태도 저장한다는 것입니다. 나는 ITEM_OPEN으로 이름을 바꿔 다른 서브 도메인에 대해서도 OPEN 액션을 가질 수 있으며, OPEN 액션을 생성하는 경우 어떤 아이템을 open으로 저장해야하고 감속기가 실제로 애플리케이션에서 새로운 상태를 생성해야합니다.

당신이 이것을 원하지 않는다면 (보기 모델로 감속기에 앱 상태를 저장하십시오) OPEN 조치를 제거하려면 간단히 반응 라우터 나 유사한 동작을 통해 처리하십시오.

그래서 제한된 정보로 판단하면 2 개의 감속기, 품목 및 카트에 대해 1 대가 있어야한다고 말하면 ADD_TO_CART 조치는 카트 감속기에서 처리해야하며 OPEN을 처리해야합니다. 항목 축소기에 의해.