showing results for - "react js usehistory push and pass props"
Abigail
07 Apr 2020
1import { useHistory } from "react-router-dom";
2
3const FirstPage = props => {
4    let history = useHistory();
5
6    const someEventHandler = event => {
7       history.push({
8           pathname: '/secondpage',
9           search: '?query=abc',
10           state: { detail: 'some_value' }
11       });
12    };
13
14};
15
16export default FirstPage;
17
18
19Accessing the passed parameter using useLocation from 'react-router-dom':
20
21import { useEffect } from "react";
22import { useLocation } from "react-router-dom";
23
24const SecondPage = props => {
25    const location = useLocation();
26
27    useEffect(() => {
28       console.log(location.pathname); // result: '/secondpage'
29       console.log(location.search); // result: '?query=abc'
30       console.log(location.state.detail); // result: 'some_value'
31    }, [location]);
32
33};
34