Vue: Deleting object key with this.$delete doesn't work properly

[purepear]

Vue.js version

1.0.26

Reproduction Link

https://jsfiddle.net/xL4ak6en/2/

Steps to reproduce

new Vue({
  el: '#app',
  data () {
    return {test: {firstKey: 1}}
  },
  template: `<div><button @click="testSet">Set</button><button @click="testDelete">Delete</button><span>{{ test | json }}</span></div>`,
  methods: {
    testSet: function () {
      this.$set('test.secondKey', 2)
    },
    testDelete: function () {
      this.$delete('test', 'secondKey')
      //this.$delete('test.secondKey')
      //Vue.delete('test', 'secondKey')
    }
  }

})

What is Expected?

When you click the "Set" button it creates test.secondKey: 2. Then when you click "Delete" button it should delete test.secondKey

What is actually happening?

It deletes the whole test object. The other 2 commented variants do nothing.

[yyx990803]

vm.$delete only supports deleting root level keys. You should use Vue.delete(obj, key) instead.

http://vuejs.org/api/#vm-delete

[purepear]

Hey @yyx990803
Thanks just realized that i was doing Vue.delete('test', 'secondKey') instead of Vue.delete(this.test, 'secondKey')
Thanks!
you can close this one.. Hope it's helpful for others.