1.0.1 • Published 6 years ago
react-router-redirect v1.0.1
Plugin the component ... Redirect from anywhere.
Installation
yarn add react-router-redirect or npm install react-router-redirect --save
Setup
- Include the
<Redirector />
component anywhere in your app below the<Router>
component fromreact-router
.
import {Redirector} from 'react-router-redirect';
const App = () =>(
<Router>
<React.Fragment>
<Redirector />
<Switch>
<Route exact path="/" component={Home}/>
</Switch>
</React.Fragment>
</Router>
)
- Now you can change the Route from anywhere
Inside a React component
import {push} from 'react-router-redirect';
class TestComponent extends React.Component {
onClick = () => {
push("/login")
}
render() {
return <button onClick={this.onClick}>Go to login</button>
}
}
Inside a saga or side effect
import { push } from 'react-router-redirect'; // or import replace, go, goForward, goBack
import client from 'client';
import clientLoginMutation from 'gql/mutations/clientLogin';
const sagas = [
{
saga: 'MUTATION.LOGIN.SUCESS',
handler: ({ login }) => {
client
.mutate({ mutation: clientLoginMutation, variables: { user: login } })
.then(() => {
push('/dashboard');
});
}
}
];
export default sagas;
Or even in React's javascript outer space
import {replace} from 'react-router-redirect';
push("/")
class TestComponent extends React.Component {
API
The module has all the methods available in React Router history property
- push
- replace
- go
- goForward
- goBack