Jak pobrać nowe dane w odpowiedzi na zmianę routera za pomocą Redux?

Question

Używam Redux, redux-router i reactjs.

Próbuję zrobić aplikację, gdzie pobierał informacje o zmianie trasy, tak, mam coś takiego:

<Route path="/" component={App}> 
    <Route path="artist" component={ArtistApp} /> 
    <Route path="artist/:artistId" component={ArtistApp} /> 
</Route> 

Kiedy ktoś wchodzi do artist/<artistId> chcę szukać artysty, a następnie renderowanie Informacja. Pytanie brzmi, jaki jest najlepszy sposób na zrobienie tego?

Znalazłem kilka odpowiedzi na ten temat, używając RxJS lub próbując pośrednika zarządzać żądaniami. Teraz moje pytanie brzmi: czy to naprawdę konieczne, czy po prostu sposób, aby architektura nie reagowała na agnostykę? Czy mogę po prostu pobrać potrzebne informacje, aby zamiast tego reagować z komponentami componentDidMount() i componentDidUpdate()? Teraz robię to, uruchamiając akcję w tych funkcjach, które żądają informacji, a komponent ponownie renderuje się, gdy dotrze informacja. Komponent ma pewne właściwości informujące mnie:

{ 
    isFetching: true, 
    entity : {} 
} 

Dzięki!

Answer 1

Teraz moje pytanie brzmi: Czy to naprawdę konieczne, czy tylko sposób, aby utrzymać architektura-agnostyk? Czy mogę po prostu pobrać potrzebne informacje, aby zamiast tego reagować z komponentami componentDidMount() i componentDidUpdate()?

Możesz to całkowicie zrobić w componentDidMount() i componentWillReceiveProps(nextProps).
To co robimy w real-world example w Redux:

function loadData(props) { 
    const { fullName } = props; 
    props.loadRepo(fullName, ['description']); 
    props.loadStargazers(fullName); 
} 

class RepoPage extends Component { 
    constructor(props) { 
    super(props); 
    this.renderUser = this.renderUser.bind(this); 
    this.handleLoadMoreClick = this.handleLoadMoreClick.bind(this); 
    } 

    componentWillMount() { 
    loadData(this.props); 
    } 

    componentWillReceiveProps(nextProps) { 
    if (nextProps.fullName !== this.props.fullName) { 
     loadData(nextProps); 
    } 

    /* ... */ 

} 

Można uzyskać bardziej wyrafinowane z Rx, ale to nie jest w ogóle konieczne.

Answer 2

1) dysponowanie optymistyczne działań zapytanie na zmiany trasy, tj BrowserHistory.listen(location => dispatch(routeLocationDidUpdate(location)));

2) ASYNC czynności: http://redux.js.org/docs/advanced/AsyncActions.html

Answer 3

ja zrobiłem to z niestandardowych wiążące prostych rekwizytów Router onEnter/onLeave zwrotnych tak:

const store = configureStore() 

//then in router 
<Route path='/myRoutePath' component={MyRouteHandler} onEnter={()=>store.dispatch(myRouteEnterAction())} /> 

To trochę hacky ale działa i nie wiem lepsze rozwiązanie teraz.