想用input删除选中的数组内容，无论你选多少个都可以删除
1 回答
繁花不似锦
TA贡献1851条经验 获得超4个赞
this.$refs.checkeds.value是什么鬼，不应该是this.$refs.checkeds.checked
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
</style>
</head>
<body>
<div id="box">
<div v-for="(item,index) in items">
<input type="checkbox" ref="checkeds" v-model="item[0].val"/>
<span>{{item[0].name}}</span>
</div>
<button @click="removeAll">提交</button>
</div>
<script src="vue.js"></script>
<script>
var vm = new Vue({
el:"#box",
data:{
items: {
A: [{ name: '伊a', occupation: '广告摄影师', company: '公司' ,val:false}],
B: [{ name: '伊b', occupation: '广告摄影师', company: '公司' ,val:false}],
C: [{ name: '伊c', occupation: '广告摄影师', company: '公司' ,val:false}],
D: [{ name: '丹d', occupation: '广告摄影师', company: '公司' ,val:false}],
E: [{ name: '伊e', occupation: '广告摄影师', company: '公司' ,val:false}],
F: [{ name: '伊f', occupation: '广告摄影师', company: '公司' ,val:false}],
G: [{ name: '伊G', occupation: '广告摄影师', company: '公司' ,val:false}],
H: [{ name: '丹h', occupation: '广告摄影师', company: '公司' ,val:false}],
I: [{ name: '丹i', occupation: '广告摄影师', company: '公司' ,val:false}],
J: [{ name: '丹j', occupation: '广告摄影师', company: '公司' ,val:false}],
K: [{ name: '丹k', occupation: '广告摄影师', company: '公司' ,val:false}],
},
checks:[]
},
methods:{
removeAll:function(){
let keys = Object.keys(this.items);
let values = Object.values(this.items);
for(var i=0;i<values.length;i++){
if(values[i][0].val){
Vue.delete(this.items,keys[i]);
}
}
console.log(this.items);
}
}
});
</script>
</body>
</html>
用v-model要简单点
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
</style>
</head>
<body>
<div id="box">
<div v-for="(item,index) in items">
<input type="checkbox" ref="checkeds" v-model="item.val" />
<span>{{item.name}}</span>
</div>
<button @click="sub">提交</button>
</div>
<script src="vue.js"></script>
<script>
var vm = new Vue({
el:"#box",
data:{
items:[{name:"a",val:false},{name:"b",val:false},{name:"c",val:false},{name:"d",val:false}],
checks:[]
},
methods:{
sub:function(){
// for(var i = this.items.length-1;i>=0;i--){
// if(this.items[i].val){
// this.items.splice(i,1);
// }
// } 这个也可以
this.items = this.items.filter((s)=>{
return s.val == false;
})
}
},
created:function(){
}
});
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消