时间戳

首页 > 解决方案 > 使用 DOM 给出的 Vue 属性删除对象的属性

javascript - 使用 DOM 给出的 Vue 属性删除对象的属性

问题描述

我将 v-for 与在TreeObject对象node的所有属性上运行的变量一起使用。如何删除我手中只有这个节点的属性之一？（假设函数无法访问TreeObject）

HTML：

<div v-for="node in TreeObject">
  <div>{{ node.name }}</div>
  <button @click="Delete(node)">delete</button>
</div>

脚本：

[...]
methods: {
  Delete(node) {
    // somehow I want to delete node from TreeObject
  }
}

标签： javascriptobjectdomvuejs2

解决方案

假设TreeObject是一个对象数组，它们唯一的定义标识符是它们的name属性 - 使用该属性来过滤 out有问题的节点。

If TreeObjectis a propon the Component (read-only) - 制作副本TreeObject并将其设置data为 say 的属性，DynamicTreeObject并在template Or中使用该属性，callback例如onDelete将有问题的节点传递给具有访问原始文件TreeObject并在那里进行删除，然后数据将滴流到您的子组件。

Delete (node) {
  this.TreeObject = this.TreeObject.filter(n => n.name !== node.name)
}

推荐阅读