Vue.js 2: 데이터 개체에서 속성 삭제

Vue.js 2: 데이터 개체에서 속성 삭제

Vue.js 데이터 개체(즉, 연관 배열)에서 속성/키를 삭제하는 방법은 다음과 같습니다.

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

검색해보니 다음 두 가지 방법을 찾았는데 둘 다 작동하지 않습니다.

• delete this.users.foo;는 DOMOM을 않습니다.
• this.users.splice('foo', 1);전혀 동작하지 않는다(어레이에서만 동작하며 오브젝트에서는 동작하지 않는다.

답은 다음과 같습니다.

Vue.delete(users, 'foo');

데
https://github.com/vuejs/vue/issues/3368#issuecomment-236642919httpsgithub.com/vuejs/vue/issues/3368#

이 사실을 한다는 것입니다.vm.$delete입니다.Vue.delete 걸 요.this.delete()에러가 발생합니다.따라서 이 예에서는 다음과 같은 답이 나옵니다.

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

또는

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

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

변경 사항이 있음을 Vue가 알 수 있도록 개체의 새 복사본을 생성해야 합니다.

ES6

const users = { ...this.users };
delete users['foo'];
this.users = users

또는 분산 연산자가 없으면

const users = Object.assign({}, this.users);
delete users['foo'];
this.users = users

언급URL : https://stackoverflow.com/questions/44954459/vue-js-2-delete-property-from-data-object