How to avoid full app reloading on onSubmit action in form?-CodePudding

Whenever user submit search form, user get redirected to search page and the searching works fine but the problem is: my app reloads completely, all my app disappears for a while, weakens the speed of my app (By doing many unwanted operations). Also, it causes for a few other bugs which make my app look ugly. So, how do I avoid the full app reloading when I do searching?

The perfect example is the

CodePudding user response：

evt.preventDefault() stops the form submission & hence the page reloading. Now you have to make an AJAX/fetch call to the /search endpoint. Something like:

handleSubmit=async (evt)=> {
    evt.preventDefault();
    var res = await fetch('/search/',{method:'POST', body:JSON.stringify(...));
    res = await res.text();
    setResult(res);
}

See https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch