fieldHooks

import { useState } from 'react'

export const useField = (type) => {
  const [value, setValue] = useState('')

  const onChange = (event) => {
    setValue(event.target.value)
  }

  // 値をクリアしたい！
  const reset = () => {
    setValue('')
  }

  return {
    type,
    value,
    onChange,
    reset
  }
}
↑これを

const name = useField('text')
<input {...name} />
こうして

name.reset()
これでinputの中身を空にしたいのですが、
Invalid value for prop reset' on <input> tag
って怒られるので、
<input {...name} reset='' />
と上書きしてごまかしているのですが、カッコ悪い…

hooksの戻り値を
return [
  { type, value, onChange },
  reset
]
とすれば
const [name, nameReset] = useField('text')
と定義でき、
<input {...name} />
だけでprops指定、
nameReset()
で値のクリアができた