React-router: React-Router with React Native, history change anywhere in the code

Created on 12 Jun 2017  路  5Comments  路  Source: ReactTraining/react-router

Hello,

I try to use history push anywhere in the code, so

my render method is just:

myhistory.js

class MyHistory {
    history;

    constructor() {
        this.history = createMemoryHistory({
            initialEntries: ['/'], // The initial URLs in the history stack
            initialIndex: 0, // The starting index in the history stack
            keyLength: 10, // The length of location.key
            // A function to use to confirm navigation with the user. Required
            // if you return string prompts from transition hooks (see below)
            getUserConfirmation: null,
        });
    }

}

export default new MyHistory;
// all of my import ..
import { MemoryRouter, Route, Switch } from 'react-router-native';
import MyHistory from './myhistory';
class MyApp extends React.Component {
    render() {
        return (
            <MemoryRouter history={MyHistory.history}>
                                <Switch>
                    <Route exact path="/" component={MainScene} />
                    <Route path="/user" component={UserScene} />
                    <Route path="/test" component={TestScene} />
                                </Switch>
            </MemoryRouter>
        );
    }
}
AppRegistry.registerComponent('MyApp', () => MyApp);

In other parts of my code I tried to call like this:

import MyHistory from './myhistory';
MyHistory.history.push('/user');

I don't know if it is a bug in react native or me

Most helpful comment

<MemoryRouter> _also_ does not take a history. If you are providing your own history, you have to use the generic <Router>.

@BenBenz usage questions should be posted to StackOverflow/Reactiflux. The issues section here should mostly be for reporting bugs. Also, you should get a faster response on one of those two.

All 5 comments

NativeRouter doesn't take a history prop. It's ignoring the one you're providing.

Also, react-router-native doesn't export browserHistory. You're mixing APIs between 2.0/3.0 and 4.0.

I have tried with MemoryRouter, but it is undefined

How I can have history with react-native ? we can do that with react-router with react-native ? @timdorr

@timdorr I have update my code

<MemoryRouter> _also_ does not take a history. If you are providing your own history, you have to use the generic <Router>.

@BenBenz usage questions should be posted to StackOverflow/Reactiflux. The issues section here should mostly be for reporting bugs. Also, you should get a faster response on one of those two.

I've just do that and it works tanks @pshrmn !
Thanks you for your advice

But all of that are not mentionned in the documentation ?

Was this page helpful?
0 / 5 - 0 ratings