如何在Vue.js中解除绑定数组副本

有什么方法可以在不将模板直接绑定到模板的情况下基于数组模板创建新数组吗?解决方案如Vue.js文档所述: 在引擎盖下，Vue.js附加了一个隐藏属性__ob__， 递归将对象的可枚举属性转换为吸气剂 和setter以启用依赖项收集.具有以下属性的键 以$或_开头的内容将被跳过.您可以将模板数组的名称以下划线符号开头: data: { testArray: [], _templateArray: [{ name: "TEST" }] }, ready: function() { this.testArray = this.$data._templateArray; }或者您是否需要将其作为Vue.js对象:this.testArray = JSON.parse(JSON.stringify(this.templateArray));对于大数据，第二种情况可能会变慢.I am trying to copy one array to another and use this like the new array without any changes to old one:<div id="app"> <div class="form-group"> <label>Test input</label> <input v-model="testArray[0].name" type="text" class="form-control" placeholder="Input"> </div> <br> <pre>testArray: {{ testArray[0] | json}}</pre> <pre>templateArray: {{ templateArray[0] | json }}</pre>new Vue({ el: '#app', data: { testArray: [], templateArray: [{name: "TEST"},], }, ready: function() { this.testArray = this.templateArray.slice(0); },});the issue is that then I am updating new array 'testArray' I also change old array 'templateArray'.The script in action: https://jsfiddle.net/4po1cpkp/7/Is there any way to create new array based on array template without directly binding it to template? 解决方案 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. 这篇关于如何在Vue.js中解除绑定数组副本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！