vee-validate useFieldArray nested arrays in arrays copy value between arrys

98 Views Asked by At

I work on a form in Vue3. In my form, I've a component that loop on a first level array This component use a sub component that loop on a second level of array

the model look like

{
 Array1: [{
   Array2:[
     {
       {propA:"a1", propB:"b1"},
       {propA:"a2", propB:"b2"}
     },
     {
       {propA:"a3", propB:"b3"},
       {propA:"a4", propB:"b4"}
     }
   ]
 }]
}

the first component

<div v-for='(array1, index) in Array1' :key="`model1[${index}]`">
    <subComponent v-model="array1.Array2/>
</div>

and the subComponent:

the first component

<div v-for='(obj, index2) in fields' :key="`model2[${index2}]`">
    <imput v-model="obj.propA" ....>
</div>

const  { fields } = useFieldArray<Array2>('array2')

my problem is that when user enter a value in the input the value is duplicated to all imputs

How can I solve this?

0

There are 0 best solutions below