这是我在其中定义表格的代码
<table v-if="Object.keys(content_state).length >= 1" class="editable-table" id="table_value">
<thead>
<tr>
<th class="editable-tabidle-header">Field</th>
<th class="editable-table-header">Value</th>
</tr>
</thead>
<tbody>
<tr v-for="(pageDataItem, idx) in content_state" :key="idx" class="editable-table-row">
<td class="editable-table-data">
<div>{{pageDataItem.modified_keyword}}</div>
</td>
<td class="editable-table-data">
<div>
<b-form-input v-model="pageDataItem.formatted_text" @click="input_form($event)" id= "'pageDataItem.modified_keyword + idx'" :style="{'border': '2px solid rgb(' +
pageDataItem.color[0] + ',' + pageDataItem.color[1] + ',' +
pageDataItem.color[2] + ')', 'border-radius': '4px'}" v-on:dblclick="showModal($event, 0)" plaintext ></b-form-input>
</div>
<b-btn variant="success" @click="Add(id)" id="Add-button">Add</b-btn>
</td>
</tr>
</tbody>
</table>
而Javascript代码是
public AddRow(id:any)
{
console.log(id)
var x =1;
let d = document.getElementById(id);
console.log(id)
let clone = d.firstElementChild.cloneNode(true);
clone.value = '';
clone.id= id+x;
this.last_added_row = clone.id;
d.appendChild(clone);
}
如何在生成的每个新行中添加删除按钮?每行只能有一个添加按钮,删除按钮应与输入框一样多。