https://www.cnblogs.com/guangyan/articles/6682686.html
let obj=[
{
name:"崔1",
},
{
name:"崔2"
},
{
name:"崔3"
},
{
name:"崔1"
},
{
name:"崔2"
},
{
name:"崔2"
},
{
name:"崔2"
}, {
name:"崔2"
},
{
name:"崔2"
},
{
name:"崔2"
},
{
name:"崔4"
},
{
name:"崔3"
},
]
var json ={}
var arr=[]
obj.forEach((item)=>{
if(!json[item.name]){
json[item.name]=true
arr.push(item)
}
})
console.log(arr)
<!DOCTYPE html>
<html>
<head>
<title>123</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>
<div id="app">
<div>
<ul>
<li v-for="item in obj">
<span>{{item.name}}</span>
<input type="checkbox" v-model="item.checked" name="">
</li>
</ul>
<div>
<b>选中成员：{{total}}</b>
</div>
</div>
</div>
<script type="text/javascript">
let obj=[
{
name:"崔1",
checked:false
},
{
name:"崔2"
,
checked:false
},
{
name:"崔3"
,
checked:false
},
{
name:"崔1"
,
checked:false
},
{
name:"崔2"
,
checked:false
},
{
name:"崔2"
,
checked:false
},
{
name:"崔2",
checked:false
}, {
name:"崔2",
checked:false
},
{
name:"崔2",
checked:false
},
{
name:"崔2",
checked:false
},
{
name:"崔4",
checked:false
},
{
name:"崔3",
checked:false
},
]
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!',
obj:obj,
},
computed:{
total(){
return this.removeDuplicatedItem(obj.filter(item=>item.checked)).length
}
},
methods:{
removeDuplicatedItem(arr){
for(var i = 0; i < arr.length-1; i++){
for(var j = i+1; j < arr.length; j++){
if(arr[i].name==arr[j].name){
arr.splice(j,1);//console.log(arr[j]);
j--;
}
}
}
return arr;
}
}
})
</script>
</body>
</html>