“CreateesearchParams” Kod odpowiedzi

Użyj BearchParams

// React Router v6: hook reads/modifies current location URL query str
import { useSearchParams } from 'react-router-dom'

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

  const handleSubmit = e => {
    e.preventDefault()
    let params = serializeFormQuery(e.target)
      // assume 'serializeFormQuery()' creates an obj of { key: value }
      // pairs from fields in the form that make up the query
    setSearchParams(params)
  }

  return (
    <div>
      <form onSubmit={handleSubmit}>{/* ... */}</form>
    </div>
  );
}
Coffee Addict

CreateesearchParams

// React Router v6:
// thin wrapper around 'new URLSearchParams(init)' which adds
// support for using objects with array values.
// Same internal fn 'useSearchParams' uses to create 'URLSearchParams'
import { createSearchParams, useNavigate } from 'react-router-dom'

const navigate = useNavigate();

navigate({
  pathname: 'listing',
  search: `?${createSearchParams({ foo: 'bar'}).toString()}`
})
Coffee Addict

Przeglądaj popularne odpowiedzi na kod według języka

Przeglądaj inne języki kodu