Querystring in React

import

import { Link } from 'react-router-dom'

link

<Link to={`/movies/${movie.id}`}>{movie.title}</Link>

route

in order to accept parameters

<Route path="/movies.:id" component={MovieForm} />

extract from querystring

 const MovieForm = ({ match }) => {
    return <h1> Movie Form {match.params.id} </h1>;
  };

Getting querystring parameters without routes

install query-string

npm i query-string

import

import queryString from 'query-string';

props (location)

 const Posts = ({match, location}) => {
   const result = queryString.parse(location.search);
 
   return (
      <div> Year : {result.year}
 }

Let's consider parameters are like

posts?sortyBy=newest&approved=true

after parse it becomes an object like

{approved:"true", sortBy:"newest"}

all parameters becomes string they need to be converted if they will be used in different types.