已编辑:无法在组件 javascript/vuejs 中编辑分配的对象元素 [英] Edited: assigned object elements cannot be edited in component javascript/vuejs
问题描述
我在方法中使用 Object.assign 函数获得了对象的副本(感谢@Chris 建议),如下所示:(它可以是 quill-editor
或任何其他文本输入字段)
<div><羽毛编辑器v-model="itemsCopy[0].text":options="editorOption"></quill-editor>{{itemsCopy[0].text}}<按钮@click="copyAndChange()">按钮>
</模板><脚本>导出默认{数据() {返回 {项目: [{文本:'text1',活动:真},{文本:'text1',活动:真},{文本:'text1',活动:真}],项目复制 [],}},方法: {函数 copyAndChange() {this.itemsCopy = this.items.slice();for (var i=0; i 案例 1.我没有运行该功能 - 一切正常 案例 2.我正在运行该函数一次 - 我可以在编辑器中看到某物"文本,我可以编辑它,但是 运行该函数后 - 我注意到我无法编辑对象的文本字段(以及活动变量) 好吧,根据我的观察,您制作了 I've got a copy of the object using Object.assign function inside a method (thanks to @Chris advice) as below:
(It could be Case1. I'm not running the function - all works Case2. I'm running the function once - and I can see the "something" text within the editor, I can edit it, but the output inside After I run the function - I noticed I cannot edit the object's text field (and also active variable) Well, you make a copy of 这篇关于已编辑:无法在组件 javascript/vuejs 中编辑分配的对象元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!{{itemsCopy[0].text}}
中的输出没有改变...items
的副本,但不要对该副本进行任何操作.quill-editor
or any other text input field)<template>
<div>
<quill-editor
v-model="itemsCopy[0].text"
:options="editorOption"
>
</quill-editor>
{{itemsCopy[0].text}}
<button @click="copyAndChange()"> </button>
</div>
</template>
<script>
export default {
data() {
return {
items: [
{text: 'text1', active: true},
{text: 'text1', active: true},
{text: 'text1', active: true}
],
itemsCopy [],
}
},
methods: {
function copyAndChange() {
this.itemsCopy = this.items.slice();
for (var i=0; i<this.itemsCopy.length; i++) {
var obj = Object.assign({}, this.itemsCopy[i]);
obj.text = "something";
this.itemsCopy[i] = obj; //replace the old obj with the new modified one.
console.log('text from items: ' + this.items[i].text)
console.log('text from itemsCopy: ' + this.itemsCopy[i].text)
}
return 0
}
}
}
</script>
{{itemsCopy[0].text}}
are not changing... items
and don't do anything with that copy, from what I see.