Vue encounters the Pit (one)--array update

Recently encountered a problem in the project, the array has been updated, but the DOM in the page does not trigger a change. What I've been thinking about is that since Vue implements real-time data binding, why isn't it updated at the view level after the model layer has changed?

In the official Vue documentation, you find

One of the most important words is--- if the object is responsive, make sure that the property is responsive after it is created, and trigger the view update, this method is primarily used to avoid the limitations that Vue cannot detect that the attribute is being added.

So how does vue listen to changes in the data?

1) How to track Changes

Each component instance has a corresponding Watcher instance object, which records the property as a dependency during component rendering, and then notifies the recalculation when the dependency is setter called, causing watcher its associated components to be updated.

2) Change detection problem

With the limitations of modern JavaScript (and deprecated Object.observe ), Vue cannot detect the addition or deletion of object attributes. Because Vue performs the conversion process on the property when the instance is initialized getter/setter , the property must data exist on the object in order for Vue to convert it so that it is responsive. For example:

var New Vue ({  data:{  A:1  }})//  ' VM.A ' is the response of VM.B = 2//  ' Vm.b ' is non-responsive

Vue does not allow the dynamic addition of new root-level response properties (Root-level reactive property) on instances that have already been created. However, it can use Vue.set(object, key, value) methods to add a response property to a nested object:

Vue.set (Vm.someobject, ' B ', 2)

You can also use the vm.$set instance method, which is also the alias of the global Vue.set method,?? We used in the project once, this.imglen=3, purpose to make this.userimgsh=["audit success", "Audit Success", "Audit Success"]

var _this= this to (var i = 0; i <this. imglen;i++) {      Ifcontinue;        ' Audit Success ');}

Vue encounters the Pit (one)--array update