<div style="padding-left: 190px" class="form-inline">
<!--<div v-for="(d,index) in counter" :key="index" style="padding-left: 190px" class="form-inline">-->
<!--<div v-for="(d,index) in counter" :key="index" style="padding-left: 190px" class="form-inline">-->
<!--此处生成党员表单-->
<!--将外部组件放到vue范围内-->
<member-info v-for="(item,index) in counter" :key="index" :content="item" :index="index" @delete="btn_delete"></member-info>
</div>
<div style="padding-left: 270px;padding-top: 20px">
<input v-on:click="btn_add" id="btn_add" class="btn btn-info" type="button" value="添加一个党员信息">
</div>
<!--外部定义组件，外部定义的组件不能写在vue范围内-->
<template id="tmp">
<div><!--组件内有多个标签必须有一个父div包起来-->
<div class="form-group">
<span style="color: red">*</span>姓名： <label class="sr-only" for="exampleInputEmail3"></label>
<input type="email" class="form-control" id="exampleInputEmail3">
</div>
<div class="form-group">
<span style="color: red">*</span>性别：<label class="sr-only" for="exampleInputPassword3"></label>
<input type="password" class="form-control">
</div>
<div class="form-group">
<span style="color: red">*</span>出生年月：<label class="sr-only" for="exampleInputPassword3"></label>
<input type="password" class="form-control">
</div>
<div class="form-group">
<span style="color: red">*</span>所属党组织：<label class="sr-only" for="exampleInputPassword3"></label>
<input type="password" class="form-control" id="exampleInputPassword3">
</div>
<input @click="btn_delete" id="btn_delete" type="button" class="btn btn-danger" value="删除">
<br/><br/>
</div>
</template>
/*vue组件*/
Vue.component('member-info', {
template: '#tmp',
props:['content',"index"],
methods: {
btn_delete:function () {
alert(this.index);
this.$emit("delete",this.index)
},
}//methods END
});
var vm = new Vue({
el:'#vue_div',
data:{
counter:[],
},
methods:{
/*添加一个党员信息按钮 被点击,就会插入一个新组件*/
btn_add:function () {
this.counter.push({});
},
btn_delete:function (index) {
alert("删除");
this.counter.splice(index, 1)
},
}//methods END
});//new Vue END
以上的代码是点击id="btn_add"按钮会生成一个组件。然后点击id="btn_delete"按钮会删除当前点击的组件，但是总是会删除最后一个，index下标是正确的。我该如何更改？谢谢！
