Vuetify v-treeview doesn't delete node

Question

I am a beginner in vuejs and vuetify and I try to add and remove nodes in a treeview.

When I do a .push(item) the treeview updates but when I delete an item from my array, the treeview does not update.

Here is an example of my code

My treeview

  <v-treeview
    [...]
    :items="formatedItems"
    item-key="slug"
    [...]
  >
      [...]
  </v-treeview>

formatedItems is declared in the data like this :

data: () => ({
  [...]
  formatedItems: [{
    id: 0,
    slug: null,
    name: i18n.t(****),
    children: []
  }]
  [...]
}),

This code correctly adds a child in my treeview :

this.formatedItems[0].children.push({
    id: element.id,
    slug: element.slug,
    name: element.name,
    children: []
});

On the other hand, this code removes the item from my array but doesn't update the treeviews :

_.remove(this.formatedItems[0].children, function(n) {
  return n.slug == element.slug;
});

this.formatedItems = this.formatedItems; // I tried this to trigger a potential magical update of vuejs but nothing...

I don't know what to try anymore, that's why I come to ask you the question:

.push being a build-in function and knowing that I use a lodash function for deletion, is there something I didn't understand about the use of vuejs that causes my treeview not to be updated?

Thank you for your attention

Answer 1

Looks like the problem somewhere else. I've tried a basic example and all works fine. Except I used filter method for deletion. codepen.io/DavidGolodetsky/pen/eYZMbgm