useSearchParams

gunakanSearchParams

Bereaksi Hook untuk menggunakan metode utilitas URLSearchParams.

Memasang

npm

npm install use-search-params --save

benang

yarn add use-search-params

Penggunaan

Hook mengembalikan nilai string kueri url saat ini bersama dengan metode URLSearchParams untuk memanipulasinya.

 import useSearchParams from 'use-search-params' ;

const MyComponent = ( ) => {
  const [
    queryString ,
    { append , entries , get , getAll , has , keys , remove , set , sort , values }
  ] = useSearchParams ( ) ;

  const entries = entries ( ) ;
  const keys = keys ( ) ;
  const values = values ( ) ;
  const value = get ( 'key' ) ;
  const allValues = getAll ( 'key' ) ;
  const hasKey = has ( 'key' ) ;

  return (
    < div >
      < p > Query string: { queryString } < / p >
      < button onClick = { ( ) => append ( 'key' , 'value' ) } >
        Append
      < / button >
      < button onClick = { ( ) => remove ( 'key' ) } > Remove < / button >
      < button onClick = { ( ) => set ( 'key' , 'value' ) } > Set < / button >
      < button onClick = { ( ) => sort ( ) } > Sort < / button >
      < button
        onClick = { ( ) => {
          window . location . search = queryString ;
        } }
      >
        Set new location with generated queryString
      < / button >
    < / div >
  ) ;
} 

Pelajari lebih lanjut

Kait ini menggunakan api URLSearchParams

Lisensi

MIT