0👍
Vue cannot detect property addition or deletion when using objects. Instead of push()
you should use Vue.Set()
.
For further information read about Reactivity in VueJs
0👍
You need to set a fixed :key when v-for loops – Vue isn’t able to keep track of what is what because Vue uses an "in-place-patch" strategy which is pretty much using index as a reference so when your render output relies on temporary state like input values, it fails.
More on: https://v2.vuejs.org/v2/guide/list.html#Maintaining-State
In your code: v-for="(sales_rep, sales_rep_key) in sales_reps">
add the :key attribute and bind it to the id. What you have named sale_rep_key is not an actual key but the index in the loop and should not be used as key. I would also suggesting naming that to simply index to avoid confusion.
So your for-loop should be:
v-for="(sales_rep, index) in sales_reps" :key="sales_rep.Sales_Rep_ID">