vuejs2でそのIDに関して削除ボタンのクリックに基づいて動的に生成されたフォームを削除する方法

私はQuasarとVueJSを使用してアプリケーションを作成しています。に見た後vuejs2でそのIDに関して削除ボタンのクリックに基づいて動的に生成されたフォームを削除する方法

<template>    
<div v-for="h in htmlList"> 
    <div v-for="r in h" > 
     <div v-html="r" v-on:click="useRemoveFromProject(1)" v-bind:id="r.id"> 
     </div> 
    </div>    
</div> 
</template> 

<script> 
/* 
* Root component 
*/ 
import Vue from 'vue' 
export default { 
    name: 'q-app', 
    data() { 
    return { 
     flag: 0, 
     htmlList: [], 
     select: 'fb', 
     select1: 'fb1', 
     multipleSelect: ['goog', 'twtr'], 
     usersInProject: [], 
     selectOptions: [ 
     { 
      label: 'Google', 
      value: 'goog' 
     }, 
     { 
      label: 'Select', 
      value: 'fb' 
     }, 
     { 
      label: 'Twitter', 
      value: 'twtr' 
     }, 
     { 
      label: 'Apple Inc.', 
      value: 'appl' 
     }, 
     { 
      label: 'Oracle', 
      value: 'ora' 
     } 
     ], 
     selectOptions1: [ 
     { 
      label: 'Integer', 
      value: 'goog1' 
     }, 
     { 
      label: 'Float', 
      value: 'fb1' 
     }, 
     { 
      label: 'String', 
      value: 'twtr1' 
     } 
     ] 
    } 
    }, 
    methods: { 
    useRemoveFromProject: function (id) { 
     console.log('hi....') 
     Vue.delete(this.htmlList, id) 
    }, 
    identifyMe: function (event) { 
     alert('hi - ' + event.target.id) 
    }, 
    process: function() { 
     this.flag += 1 
     let temp = [] 
     temp.push('<div class="card" id="a_' + this.flag + '"> <div class="card-content content-center "> <large id="l4">Expression LHS:</large> <input><br> <large id="l5">Operators:</large> <q-select type="radio" v-model="this.select" :options="this.selectOptions"></q-select><br><large id="l4">Expression RHS:</large> <input><br><large id="l5">Data type:</large> <q-select type="radio" v-model="select1" :options="selectOptions1"></q-select><br></div><button class="cordova-hide circular red " style="margin-bottom:5px; margin-right:30px;" v-on:click="userRemoveFromProject(i)"><i>delete</i></button><input value="click" type="button"> </div>') 
     let ids = ['a_' + this.flag] 
     console.log(ids) 
     this.htmlList.push(temp) 
    } 
    } 
} 
</script>

出典

2017-07-03 swathi

ため、あなたはすべてのエラーを取得していますか？あなたが使用しているvueのバージョンは何ですか？ –

'useRemoveFromProject（1）'なので、キーは常に1ですか？それ本当？（私の場合は、存在する場合にのみ2番目の要素を削除することを意味します）。おそらく現在の要素のインデックスを見ますか？ –