FrontendDeveloper.in

Vue.js question detail

What are the caveats of array changes detection?

Vue cannot detect changes for the array in the below two cases,

  1. When you directly set an item with the index,For example,
vm.todos[indexOfTodo] = newTodo
  1. When you modify the length of the array, For example,
vm.todos.length = todosLength

You can overcome both the caveats using set and splice methods, Let's see the solutions with an examples,

First use case solution

// Vue.set
Vue.set(vm.todos, indexOfTodo, newTodoValue)
(or)
// Array.prototype.splice
vm.todos.splice(indexOfTodo, 1, newTodoValue)

Second use case solution

vm.todos.splice(todosLength)
Back to all Vue.js questions
Get LinkedIn Premium at Rs 399