When the v-for loop in vue, the data of the list is updated but the page is not rendered, how should it be rendered?

When the v-for loop in

vue, the data of the list is updated but the page is not rendered, how should it be rendered?
officials say that there are mutation methods, such as push,shift, and so on. At present, we can only use a stupid method to add a push and then re-render, but I don"t think it"s very good. Is there a more formal method to refresh the list when the data is refreshed?

Mar.02,2021

vue official documentation:
ide/list.html-sharp%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9" rel=" nofollow noreferrer "> ide/list.html-sharp%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9" rel= "nofollow noreferrer" > https://cn.vuejs. Org/v2/guide.

due to the limitation of JavaScript, Vue cannot detect the following changing arrays:
when you directly set an item using the index, for example: vm.items [indexOfItem] = newValue
when you modify the length of the array, for example: vm.items.length = newLength

to solve the first kind of problem, the following two ways can achieve the same effect as vm.items [indexOfItem] = newValue. It will also trigger a status update:
/ / Vue.set Vue.set (example1.items, indexOfItem,newValue)
/ / Array.prototype.splice example1.items.splice (indexOfItem,1, newValue)
to solve the second type of problem, you can use splice: example1.items.splice (newLength)

the above two categories need special treatment, and other list data changes can be detected by vue (including various splice,sort,push, or whole array substitution, etc.)


try Vue.set ?
if you are really lazy, you can this.data = JSON.parse (this.data)); ?

)
Menu