가 돌아 오는 반작용 -. 나는 사용자가 로그인 한 경우에만 표시하는 국가의 많은 부분을 조건부 선택 내 응용 프로그램에서

Question

을

는 사용자가 로그인하고 페이지로 바로 이동하는 경우, 라우터는 페이지를 표시 비동기 호출을해야하므로 상태의 일부가 아직 채워지지 않습니다.

이제 내비게이션 막대에 상태의 일부를 가져야하는 버튼을 표시해야한다고 가정하지만이 상태는 비동기 호출 finis 이후로 채워지지 않습니다. pratically

더,이 선택기 가지고

export const getSelectedCustomerName = state => { 
    return state.systems.entities[getSelectedCustomer(state)].customer; 
} 

: selectedCustomer가 initialState 감속기의 일부이기 때문에, 이에

export const getSelectedCustomer = state => state.systems.selectedCustomer; 

아무 문제가없는을 문제는 셀렉터에

entities의 부분이 initialState에있는 빈 배열이며 채워집니다 d 비동기 호출. 응용 프로그램이 시작하고 난 (연결 함께 - mapStateToProps)지도 할 때

그래서, entities가 비어 있는지 때문에 getSelectedCustomerName 내가 오류를 얻을 선택기에 걸릴 경우, customer 필드

에게 아직 간단한 솔루션을 존재하지 않는 일부는 if-else이지만, 응용 프로그램의 "모든"부분에서이 작업을 수행해야합니다.

이를 방지하기 위해 더 나은 솔루션이 있다면 내가 부탁 해요 ...

Answer 1

const NullCustomerEntities = { 
    customer: "Anonymous" 
} 

export const getSelectedCustomer = state => state.systems.selectedCustomer; 

export const getCustomerEntities = state => { 
    return state.systems.entities[getSelectedCustomer(state)] || NullCustomerEntities; 
} 

export const getSelectedCustomerName = state => { 
    return getCustomerEntities(state).customer; 
} 

이것은 Null Object pattern 의 전형적인 예 (루비에있는 코드를 생각하지 않았 으면)입니다.