question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

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

See original GitHub issue

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

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

5reactions
pshrmncommented, Jun 12, 2017

<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.

1reaction
ghostcommented, Jun 12, 2017

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 ?

Read more comments on GitHub >

github_iconTop Results From Across the Web

React-Router with React Native, history change anywhere in ...
Hello, I try to use history push anywhere in the code, so my render method is just: myhistory.js class MyHistory { history; ...
Read more >
How to push to History in React Router v4? - Stack Overflow
You can use the history methods outside of your components. Try by the following way. First, create a history object used the history...
Read more >
Programmatically Navigate with React Router - Telerik
This history object lets us manually control the history of the browser. Since React Router changes what we see based on the current...
Read more >
Using 'history' to navigate your React app from outside a ...
To do this, we import BrowserRouter , HashRouter , MemoryRouter , or NativeRouter from react-router-dom and then wrap our <App /> component in...
Read more >
react-router: useHistory, useLocation and useParams
Basically, this hook gives you access to history objects and you have ... import { useHistory } from 'react-router-dom'; const Portfolio ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found