Reaktif-Yönlendirici'de kayıt/gönderimi nasıl beklerim?

Question

Redux-Router kullanmıyorum (belki de yapmalıyım?) Fakat yönlendiricim sağlayıcı tarafından sarılıyor ve mağaza buna aktarılıyor.

Durumu ve gönderimi onEnter işleyicisinde okumak isterim.

Answer 1

sadece onları döndüren bir işlev benim yolları sarılmış

// store.js 
 

 
import { createStore } from 'redux' 
 
import todoApp from './reducers' 
 
    
 
export default createStore(todoApp);

.

Bu onlar store argüman erişebilir ve can dispatch() o sebeple Herhangi onEnter/onExit işlevleri ile de tanımlanmıştır bir tartışma

olarak redux mağaza geçmesine izin verir.

import React from 'react' 
import { IndexRoute, Route } from 'react-router' 

import App from './components/app' 
import FourOhFour from './components/pages/404' 
import Home from './components/home' 
import LogIn from './components/account/log_in' 
import ResetPassword from './components/account/reset_password' 
import SignUp from './components/account/sign_up' 

export function getRoutes (store) { 
    function doSomething (thing) { 
    store.dispatch(addToDoActionCreator(thing)) 
    } 

    function authenticate (nextState, replaceState) { 
    const { currentUser } = store.getState(); 

    if (!currentUser) { 
     replaceState(null, '/log-in'); 
    } 
    } 

    return (
    <Route path='/' component={App}> 
     <IndexRoute component={Home} onEnter={(nextState, replaceState)=>{doSomething('get coffee')}} /> 

     <Route path='log-in' component={LogIn} onEnter={authenticate} /> 
     <Route path='sign-up' component={SignUp} /> 
     <Route path='reset-password' component={ResetPassword} /> 

     <Route path="*" component={FourOhFour}/> 
    </Route> 
); 
} 

Sunucu tarafında (express.js benim için), middleware ile oldukça erken bir redux deposu kurarım. Böyle bir şey.

server.use((req, res, next) => { 
    const createStoreWithMiddleware = applyMiddleware(
    thunkMiddleware 
)(createStore); 
    res.store = createStoreWithMiddleware(rootReducer); 

    next(); 
} 

Şimdi mağaza yanıt nesnesine eklenmiştir ve diğer ara katman yazılımları/yolları tarafından kullanılabilir. Durumu (res.store.getState()) alabilir ve durumu güncelleştirmek için gönderebilirler.

Answer 2

Sadece redux deponuzu ayrı bir dosyada oluşturun ve gerektiğinde bunu isteyin.

// the file where you define your routes and onEnter 
 

 
import { render } from 'react-dom'; 
 
import { Router, Route } from 'react-router'; 
 
import store, { dispatch } from './store.js'; 
 

 
function enterHandler(){ 
 
    dispatch(allTheGoodStuff); 
 
} 
 

 
render(
 
    <Router> 
 
    <Route onEnter={ enterHandler } ... 
 
)