Currently, I am using VueJS to dynamically generate a form based on a JSON schema and then attempting to save the data into my Vuex state.
Here is an overview of the code I have written so far (simplified):
<div v-for="field in schema" :key="field.fieldName">
<div> {{ field.fieldName }} </div>
<div v-if="field.type==='text'">
<b-input type="text" @change="onFieldChanged" :placeholder="field.fieldName"></b-input>
</div>
</div>
Additionally, here is the onchange method that I have implemented:
methods: {
onFieldChanged (val) {
// Code to send 'val' to the state for storage in the form object
}
}
It would be ideal if there was a way to also pass the specific field.fieldName from the v-for loop to accurately track which field has been modified. Is there a solution for achieving this?
Another approach that I considered after typing this out is using v-model to directly link the fields and their values to an object in my data.