javascript - React Router v4 with Redux - dispatch is not passed -
so, i've been trying switch app react router v4 (the api has changed quite lot), , i've reached:
router setup
const createstorewithmiddleware = applymiddleware( thunkmiddleware, createlogger )(createstore); const store = createstorewithmiddleware(rootreducer); const routerlayout = () => ( <provider store={store}> <app> <switch> <route component={login} path="/login" /> <route component={accountdetails} path="/account/:id" /> </switch> </app> </provider> ); const routes = ( <hashrouter> <routerlayout /> </hashrouter> ); reactdom.render(routes, document.getelementbyid("app-container"));
now problem reason can't redux hooked components:
export class login extends react.component<any, any> { componentdidmount() { console.log(this.props); // this.props.dispatch undefined // i'm getting router props: // match: object, location: object, history: object, staticcontext: undefined) } render() { return ( <div> login component </div> ); } } export default connect((state: appstate): => { return state; })(login);
it's interesting app
component can connect , access dispatch
without issues, login
doesn't have it. i'm pretty sure i'm doing wrong, don't know exactly.
if this.props.dispatch
not available, component not connected redux.
i think problem here exporting login twice, 1 react component , other component connected redux store (with export default). in file routerlayout exists, import login curly brackets , login component here component not connected redux.
in addition, createstore not right. should following:
const createstorewithmiddleware = (reducer) => { const middlewares = applymiddleware( thunkmiddleware, createlogger ); return createstore( reducer, middlewares ); } const store = createstorewithmiddleware(rootreducer);
Comments
Post a Comment