Vue.js 2: Supprimer une propriété d'un objet de données

Question

Comment pouvez-vous supprimer une propriété/clé d’un objet de données Vue.js (par exemple, un tableau associatif) comme ceci:

var vm = new Vue({
    data: {
        users: {
            foo : { firstName: ..., lastName: ... },
            bar : { firstName: ..., lastName: ... }
        }
    },
    methods: {
        someFunction : function ()
        {
            // how to remove `users.foo`?
        }
    }
});

En cherchant sur Google, j'ai trouvé ces deux façons, mais les deux ne fonctionnent pas:

• delete this.users.foo; ne met pas à jour le DOM
• this.users.splice('foo', 1); ne fonctionne pas du tout (ne fonctionne probablement que sur des tableaux, pas sur des objets)

Answer 1

La réponse est:

Vue.delete(users, 'foo');

Il m'a fallu un certain temps pour le trouver, c'est pourquoi je l'affiche ici ;-)
https://github.com/vuejs/vue/issues/3368#issuecomment-236642919

Answer 2

Il est important de savoir que vm.$delete est un alias pour Vue.delete et si vous essayez quelque chose comme this.delete(), vous obtiendrez une erreur. Donc, dans votre exemple, la réponse serait:

this.$delete(this.users, 'foo')

ou

vm.$delete(vm.users, 'foo')

https://vuejs.org/v2/guide/migration.html#vm-delete-changed