Closed jaynakus closed 7 years ago
On some occasions I want to have an opportunity to push a route. Normally I would do it with injecting routing store. for example
@inject('routing') @observer export default class Home extends Component { render() { let {routing} = this.props; return ( <button onClick={()=>routing.push('/path/to/go')}>Push it</button> ) }
But to have this work I have to configure it like this
import {Router} from "react-router-dom"; import createBrowserHistory from 'history/createBrowserHistory'; import {RouterStore, syncHistoryWithStore} from 'mobx-react-router'; const renderApp = () => { const browserHistory = createBrowserHistory(); const routeStore = new RouterStore(); const history = syncHistoryWithStore(browserHistory, routeStore); render( <AppContainer> <Provider store={store} routing={routeStore}> <Router history={history}> <App /> </Router> </Provider> </AppContainer>, document.getElementById("root") ); };
I expect it work
render() { let {routing} = this.props; return ( <div > <Switch> <Route exact path="/" render={props => ( <LazyRoute {...props} component={import("../pages/Home")}/> )}/> <Route exact path="/path/to/go" render={props => ( <LazyRoute {...props} component={import("../pages/OtherPage")}/> )}/> </Switch> </div> ) }
Location change on address bar but OtherPage does not render until I do some thing like this:
render() { let {routing} = this.props; return ( <div > <span style={{display: 'none'}}>{routing.location.pathname}</span> <Switch> <Route exact path="/" render={props => ( <LazyRoute {...props} component={import("../pages/Home")}/> )}/> <Route exact path="/path/to/go" render={props => ( <LazyRoute {...props} component={import("../pages/OtherPage")}/> )}/> </Switch> </div> ) }
Am I doing something wrong? I feel I'm missing something
Oh, I found! The problem was with mobx version. Mine was >3 but you use 2.5. Is there any chance to upgrade version?
Dependencies upgraded in the latest commit!
On some occasions I want to have an opportunity to push a route. Normally I would do it with injecting routing store. for example
But to have this work I have to configure it like this
I expect it work
Location change on address bar but OtherPage does not render until I do some thing like this:
Am I doing something wrong? I feel I'm missing something