Vue rendering and monitoring issues
Vue value changes cannot cause monitoring and rendering problems.
The Vue official explains how to change the listening array. If you use the index to change the parameters of the array, Vue's watch event and rendering will not be triggered. For example ↓
1. Directly set a certain value of the array through the index,
this.objArr[index] = newValue;
2. Directly set through the index A certain attribute of the object in the array,
this.objArr[index].pro = newValue;
3. By modifying the length of the array, < a i=5> this.objArr.length = newLength; The above three situations will not trigger vue's monitoring and rendering.
Solution
The official document explains: Changing vue change methods
There are seven methods in total, which will enter watch and trigger vue view update.
for example
As follows
this.arr[index] = newValue; Directly setting a value in the array through the index will not trigger watch or view updates.
Then we will use the method he gave: splice()
I will put the method of using splice() at the end. If you don’t know it, you can provide reference.
this.arr.splice(index,1,newValue) //This will trigger the update of vue's watch and view.
How to use splice()