标签：article class length check body mod console box vue
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>
标签：article class length check body mod console box vue
原文地址：https://www.cnblogs.com/MR-cui/p/10168508.html
