Discussion on: Refactoring useState() To useReducer()

<template>
  <form>
    ...
  </form>
</template>

<script>
import { reactive, toRefs } from '@vue/composition-api'

function useReducer(reducerFn, initialState) {
  const state = reactive(initialState)
  const dispatch = (action) => {
    console.log('dispatching action:', action)
    reducerFn(state, action)
  }
  return [state, dispatch]
}

function reducer(state, action) {
  const { type, payload } = action
  state[type] = payload
}

export default {
  setup() {
    const initialState = {
      taxYear: 2019,
      filingStatus: 'SINGLE',
      income: '75000',
      children: 0,
      stimulusAmount: -1,
    }
    const [state, dispatch] = useReducer(reducer, initialState)

    dispatch({
      type: 'taxYear',
      payload: 2020,
    })
    // state.taxYear === 2020
    return {
      ...toRefs(state),
    }
  },
}
</script>