DEV Community

Discussion on: React hooks: An advanced look at converting useState to useReducer

Collapse
 
brense profile image
Rense Bakker

You don't need switch statements to use reducers for forms like that, this is enough:

const initialState = {
  name: 'Default name',
  title: 'Default title',
  favorite_number: '3',
  favorite_primary_color: 'red',
}

function formReducer(prevState, nextState){
  return { ...prevState, ...nextState }
}

function FormComponent(){
  const [formData, setFormData] = useReducer(formReducer, initialState)

  return (
    <form>
      <input
        value={formData.name}
        onChange={event => setFormData({ name: event.target.value })}
      />
    </form>
  )
}
Enter fullscreen mode Exit fullscreen mode