Routing in React - query parameters, queryString, programmatic navigation, Obtain query parameters from queryString.parse(this.props.location.search)
React JS Tutorial - Course Lessons #9 - Routing in React - query parameters - react router- Learn ReactJS
Link for previous lesson - Routing in React - • React JS Tutorial - Course Lessons #8 - Ro...
React terms : queryString, query parameters, queryString.parse, this.props.location.search, this.props.history.push, this.props.history.replace, programmatic navigation, Routing, react-router-dom, URL, BrowserRouter, Route, Switch, Link, Redirect, Literal Template, Route parameters, spread the props, render, path
Route props - match, location, history, match.params
Key components in routing - 2
query parameters : after the ? (question mark) in the URL, separated by & (ampersand)
Obtain using queryString.parse(this.props.location.search)
Programmatic navigation using props.history
With back - this.props.history.push(url)
Without back - this.props.history.replace(url(
Literal Template : introduced in ES6, a powerful way to construct dynamic strings
With Sample Codes and Exercises, do the exercises and understand the various validation techniques.
For the laptops code exercise, the state data is available at https://raw.githubusercontent.com/edu...
Learn complete React in this video tutorial series. A must watch for all ReactJS beginners and learners. With lots of samples, code, practice questions and projects, learn and master React and become an awesome front end developer.
00:00 Programmatic navigation
01:35 Sample Code 1a - Simple Programmatic navigation
04:36 Sample Code 1b - Form submit and routing
09:12 Query parameters and queryString
10:45 Sample Code 2a - query parameter
17:51 Sample Code 2b - multiple query parameters
24:14 Sample Code 2c
41:32 Code Exercise 1a: Query Parameters
57:55 Code Exercise 1b: Laptop App with Query Parameters
Complete React Lessons and ReactJS playlist -
• React Tutorials - Complete React JS - From...