선택기의 액세스 라우터 상태가 반응합니다.

Question

내 앱 상태의 일부를 상점에서 URL로 이동 중입니다.

현재 redux를 사용하여 선택기를 만들려면 reselect과 함께 내 앱의 상태를 관리하고 있습니다. 선택기는 redux 저장소의 상태에서 파생 된 값을 계산합니다 (원칙적으로 이것은 유일한 입력입니다).

이제는 상태의 일부가 URL 내에 포함될 것이므로 어떻게 읽을 지 모르겠습니다.

내가 솔루션을 표시 될 수 첫눈에 react-router-redux, 살펴 보았다 그러나 이것은 그것을을 할 수있는 올바른 방법으로하지 않는 것 (실제로, 나는 state.routing.locationBeforeTransitions.query를 사용하여 원하는 값을 얻을 수 있습니다) 자신의 문서에서 주어진대로 :

Redux 저장소에서 위치 상태를 직접 읽지 않아야합니다.

내 위치 상태에 액세스 할 수있는 또 다른 방법이 있습니까, 아니면이 경고를 무시하고 내 선택기에서 사용해야합니까?

Answer 1

react-router-redux 문서가 라우터 상태를 이와 같이 설정하지 않는 것이 좋습니다.

재 선택 셀렉터는 일반적으로 첫 번째 인수 (상태) 만 사용하지만 실제로 두 번째 인수 (구성 요소의 소품)를 사용할 수 있습니다. 이 소품 내부에 params이 React Router로 전달된다는 것을 알 수 있습니다 (사용자가 connect로 보내려는 구성 요소로 전달된다고 가정).

제가 수행하는 모든 작업이 location의 대문자 인 아래에 간단한 예제가 포함되어 있지만 state을 사용하여 Redux에서 물건을 가져 오는 다른 선택기가 포함 된 원하는 선택기를 만드는 것으로 상상할 수 있습니다 저장.

const selectLocation = (_state, props) => props.location; 
const selector = createSelector(
    selectLocation, 
    (location) => ({ upperCasedLocation: location.toUpperCase() }) 
); 

const MySmartComponent = (props) => <div>{props.upperCasedLocation}</div>; 

export default connect(selector)(MySmartComponent);