How can I auto-create variables for v-model?

Question

Vue.js

Recently I came across support for a project that has just a huge number of forms, and caught myself thinking that the code is pretty much the same and only the variables that we track through v-model and url for sending differ.
I thought to write a common mixin for all this, which I am trying to do now. There were no problems with writing common methods, but I got stuck at one point, each form has different input names, and each time I don’t want to fill 10-15 lines in data.
Maybe there is some way to find out which v-models are registered in the component and add them to data automatically.
for example

<tamplate>
      <input type="text" v-model="form.user">
      <input type="password" v-model="form.password">
    </tamplate>

On the release date will be

{
form: {
  user: ''
  password: ''
}
}

I got acquainted with mixins not so long ago, perhaps arguments can be passed in them, but I didn’t find anything like that in the dock

PS purely in theory, you can score and not create a variable in data, vue will do it itself as soon as the user starts filling in the field, but it seems to me an option to break the back if the object is not complete, but this is not accurate :), I am weak in this matter

Answer 1

It is possible not to store field values ​​in data if they are needed only for sending.

<form @submit.prevent='onSubmit'>
   <input type="text" name="user">
   <input type="password" name="password">
   <button type='submit'>Отправить</button>
</form>

async onSubmit($event) {
   const fd = new FormData($event.target); 
   const response = await this.$axios.post('api/form', fd);
}