Create a Vue 3 Form With v-model

Up until this point we have been using ref for our state. But we need to create a form with multiple fields so we need to use a more complex data structure. reactive, unlike ref, does a deep comparison of the data, so we can use an array or object with it.

Then, to update our reactive data, we use the v-model property on our inputs. This keeps our data in sync with the current input value.