How to update search params from input field

[pineshmenat]

How to map query string to input field and update it realtime if input field is updated in react router v6?

[ondrejvelisek]

Something like this does not work? (not tested)

import { useSearchParams } from "react-router-dom";

function App() {
  const [searchParams, setSearchParams] = useSearchParams();

  function onChange(event) {
    setSearchParams(event.target.value);
  }

  return (
      <input value={searchParams} onChange={onChange}/>
  );
}

[pineshmenat]

Thank you @ondrejvelisek for your help. I also found one good example in docs