数组使用-小笔记

118 阅读1分钟
  //  find的简单使用
   let myid=2
    this.myCateIdArr = arr_id  数组对象 [{id:1,name:'测试1'},id:2,name:'测试2'}]
          // 查找符合的id 比如 测试2 
          this.myCateId = this.myCateIdArr.find((el)=>{
          // 判断查找id和定义id 相等
            return el.id==myid
          }).name
          //返回当前符合id的name值
filter使用

data(){
 aaa: [
        {
          label: "tab1",
          name: "first"
        },
        {
          label: "tab2",
          name: "second"
        },
        {
          label: "tab3",
          name: "third"
        },
        {
          label: "tab4",
          name: "fourth"
        }
      ],
      
      
      }
      
     接口返回数据是
     
        bbb: [
        {
            "id": "tab1",
            "name": "ceshi1"
        },
        {
            "id": "tab2",
            "name": "ceshi2"
        },]
        
        
    那么以返回的动态数据,去对比全量数据。 页面中只展示有返回的数据
    
    <el-tabs v-model="activeName" @tab-click="ceshiClick">
        
          <el-tab-pane
            v-for="(item ,index ) in ccc"
            :key="index"
            :label="item.label"
            :name="item.name"
            
          >
            <div style="color:red">{{item.label}}</div>
            </el-tab-pane>
            </el-tabs>
            
            
           重要逻辑是
           
        filterList(){

     this.ccc= this.aaa.filter((item)=>{
      return    this.bbb.map((inner,i) =>{
          return  inner.id
        }).includes(item.label)
      })
       
    },   
    
   ** 那么结果为 tab1和tab2 展示**
     
      this.ccc= this.aaa.filter((item)=>{
      return  this.bbb.map(inner=>inner.id).includes(item.label);
       
    },   
    
    比较简单的方法。就是对比2个数组
    
   这里就给一个思路
   
   let arr1 = []
   array1.forEach(v => {
        array2.forEach(a => {
        if(a.id == v.id)
           arr1.push(v)}
        })
        });