How to unbind an array copy in Vue.js
As Vue.js documentation says:
Under the hood, Vue.js attaches a hidden property
__ob__and recursively converts the object’s enumerable properties into getters and setters to enable dependency collection. Properties with keys that starts with $ or _ are skipped.
You can store your template array with name started from underscore sign:
data: { testArray: [], _templateArray: [{ name: "TEST" }] }, ready: function() { this.testArray = this.$data._templateArray; }Or you if need it as a Vue.js object:
this.testArray = JSON.parse(JSON.stringify(this.templateArray));The second case might be slow for big data.
I used Vue extend function Vue.util.extend to copy array with un-binding in Vue 2:
this.items_list.push(Vue.util.extend({}, this.list_item));
You can use slice() of array prototype read more in MDN Array.prototype.slice()
this.testArray = [].slice.call(this.templateArray)