Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Autoría | Ultima modificación | Ver Log |

import React, { useEffect } from 'react'
import { useForm } from 'react-hook-form'
import { useHistory, useLocation } from 'react-router-dom'

const SearchBar = () => {
  const { register, handleSubmit, setValue } = useForm()
  const location = useLocation()
  const history = useHistory()

  useEffect(() => {
    const keyword = new URLSearchParams(location.search).get('keyword')
    setValue('keyword', keyword)
  }, [])

  const onSubmitHandler = ({ keyword }) => {
    history.push({
      pathname: location.pathname,
      search: `?keyword=${keyword}`
    })
  }

  return (
    <div className="search-sec">
      <div className="container">
        <div className="search-box">
          <form name="form-listing-search" onSubmit={handleSubmit(onSubmitHandler)}>
            <input
              type="text"
              name="keyword"
              placeholder="¿Que desea encontrar?"
              ref={register}
            />
            <button type="submit">Buscar</button>
          </form>
        </div>
      </div>
    </div>
  )
}

export default SearchBar