0

내가 반응하고 redux 새로운, 내가 reactux 라우터 dom에서 내 프로젝트를 시작했지만 지금은 혼합에 Redux를 추가하려고합니다.혼란 반응 라우터 dom과 반응 라우터 redux

react-router-dom을 계속 사용하거나 react-router-redux를 설치해야합니까? 아니면 둘다? 경로 구성 요소가 동일하게 작동합니까? 나는 약간의 반응 라우터 dom의 사용으로 혼란 스러울까요?

모든 링크 구성 요소를 작업을 상점에 전달하는 요소로 전환합니까?

도움 주셔서 감사합니다.

답변

1

일반적으로 Redux를 사용하는 경우 반응 라우터를 캡슐화하는 react-router-redux를 사용하는 것이 좋습니다.

앱을 초기화 할 때만 반응 라우터에서 Redux로 두 가지를 전달해야합니다 (RouterbrowserHistory). app.js에서

:

import { Router, browserHistory } from 'react-router'; 
import { syncHistoryWithStore } from 'react-router-redux'; 

const initialState = {}; 
const store = configureStore(initialState, browserHistory); 

const history = syncHistoryWithStore(browserHistory, store); 

const render =() => { 
    ReactDOM.render(
    <Provider store={store}> 
     <Router 
      history={history} 
      routes={rootRoute} 
     /> 
    </Provider>, 
    document.getElementById('app') 
); 
}; 

당신은 돌아 오는의 제공자 요소의 자식으로 반응의 라우터 요소를 제공하고, 당신은 또한 라우터 요소에의 반작용 browserHistory의 돌아 오는 래퍼를 제공합니다.

프로젝트의 나머지 부분에서는 React를 직접 호출하는 대신 react-router-redux 만 사용하면됩니다.

react-router-dom BTW는 반응 라우터를 캡슐화하는 React 4에서 단순화의 또 다른 계층이지만 프로젝트 아키텍처가 Redux 인 경우 Redux의 규칙에 따라 작업해야하므로 반응 만 사용하십시오 -router-redux를 사용하여 각 작업의 저장소를 통과합니다 (위에서 언급 한 초기화 제외).

1

react-router-redux를 사용하는 것이 좋습니다. react-router-redux를 사용하면 라우터 상태를 Redux Store에 연결하여 나머지 앱 상태와 상호 작용하는 데 사용하는 것과 동일한 API로 라우터와 상호 작용할 수 있습니다.

0

react-router-redux를 사용하십시오.

react-router-redux를 사용하면 위치 상태가 일반 대상으로 redux 저장소에 유지됩니다. 즉, 다른 상태와 마찬가지로 위치 정보를 연결할 수 있습니다.