javascript - para - redux react español

Cómo utilizar reaccion-redux con mapStateToProps, MapDispatchToProps y redux-router

Question

Quiero usar en mi contenedor "LoginPage" (componente inteligente) redirigido después de iniciar sesión. Algo como esto:

handleSubmit(username, pass, nextPath) {
function redirect() {
this.props.pushState(null, nextPath);
}
this.props.login(username, pass, redirect); //action from LoginAcitons
}

El nombre de usuario y el pase llegaron del componente tonto.

Componente inteligente conectar

function mapStateToProps(state) {
return {
user: state.app.user
};
}
function mapDispatchToProps(dispatch) {
return bindActionCreators(LoginActions, dispatch)
}

¿Cómo puedo agregar pushState desde redux-router? O estoy en el camino equivocado?

export default connect(mapStateToProps, {pushState})(LoginPage); //works, but haven''t actions
export default connect(mapStateToProps, mapDispatchToProps)(LoginPage); //works, but haven''t pushState
export default connect(mapStateToProps, mapDispatchToProps, {pushState})(LoginPage); //Uncaught TypeError: finalMergeProps is not a function

Answer 1

Esqueleto simple:

import React from ''react'';
import ReactDOM from ''react-dom''
import { createStore,applyMiddleware, combineReducers } from ''redux''
import { connect, Provider } from ''react-redux''
import thunk from ''redux-thunk''
import logger from ''redux-logger''
import View from ''./view'';
import {playListReducer, artistReducers} from ''./reducers''
/*create rootReducer*/
const rootReducer = combineReducers({
playlist: playListReducer,
artist: artistReducers
})
/* create store */
let store = createStore(rootReducer,applyMiddleware(logger ,thunk));
/* connect view and store */
const App = connect(
state => ({
//same key as combineReducers
playlist:state.playlist,
artist:state.artist
}),
dispatch => ({
})
)(View);
ReactDOM.render(
<Provider store={store}>
<App />
</Provider> ,
document.getElementById(''wrapper''));

Answer 2

function mapStateToProps(state) {
return {
user: state.app.user
};
}
function mapDispatchToProps(dispatch) {
return {
actions: bindActionCreators(LoginActions, dispatch),
routerActions: bindActionCreators({pushState}, dispatch)
}
}
export default connect(mapStateToProps, mapDispatchToProps)(LoginPage);