Using React Router Form
In Chapter 6, we started to learn about React Router’s Form component. We learned that Form is a wrapper around the HTML form element that handles the form submission. We will now cover Form in more detail and use it to provide a nice submission success message on our contact form.
Carry out the following steps:
- First, install React Router by executing the following command in the terminal:
npm i react-router-dom
- Now, let’s create a
ThankYouPagecomponent, which will inform the user that their submission has been successful. To do this, create a file calledThankYouPage.tsxin thesrcfolder with the following content:import { useParams } from 'react-router-dom';export function ThankYouPage() {const { name } = useParams<{ name: string }>();return (
<div className="flex flex-col py-10 max-w-md mx-auto">
<div
...