Implementing form submission in the search form

In Header.tsx, carry out the following steps to implement submission on the search form:

  1. Import the FormEvent type from React:
import { ChangeEvent, FC, useState, FormEvent } from 'react';
  1. Create a submit handler just beneath the handleSearchInputChange function:
const handleSearchSubmit = (e: FormEvent<HTMLFormElement>) => {
e.preventDefault();
history.push(`/search?criteria=${search}`);
};

So, this sets the browser location path to search with the appropriate criteria query parameter.

  1. Let's wire this handler up to the search form:
<form onSubmit={handleSearchSubmit}>
<input ... />
</form>

Our project isn't compiling yet because we need to pass the onSubmit function prop into the Form component from the ask and answer forms. So, we'll try the search form out later.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.145.19.242