teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

プログラムとタイトルを修正

2020/07/05 08:31

投稿

matsuda1
matsuda1

スコア2

title CHANGED
@@ -1,1 +1,1 @@
1
- Vueでネストしたデータから特定の要素を削除したい。
1
+ Vueでネストの深いオブジェクトから特定の要素を削除したい。
body CHANGED
@@ -26,7 +26,7 @@
26
26
  </i>
27
27
  {{item.name}}
28
28
  <i class="fas fa-minus-circle"
29
- @click="$emit('delete-item',item)"
29
+ @click="$emit('delete-item',{item:item,index:index})"
30
30
  ></i>
31
31
  </li>
32
32
  <ul v-show="isOpen">
@@ -35,6 +35,7 @@
35
35
  :key="index">
36
36
  <tree-item
37
37
  :item="child"
38
+             :index="index"
38
39
  @add-item="$emit('add-item', $event)"
39
40
  @delete-item="$emit('delete-item', $event)">
40
41
  </tree-item>
@@ -120,13 +121,14 @@
120
121
  return item.children.push({name: "new folder"})
121
122
  }
122
123
  },
123
- deleteItem:function(item){
124
+ deleteItem: function (item) {
124
- treeData.children.map((tree,index)=>{
125
+ treeData.children.map((tree, index) => {
125
- if(tree.name==item.name){
126
+ if (tree.name == item.item.name) {
127
+ if(item.index===index){
126
- return this.treeData.children.splice(index,1)
128
+ return this.treeData.children.splice(index, 1)
129
+ }
127
130
  }
128
131
  })
129
- console.log("削除")
130
132
  }
131
133
  }
132
134
  })