首页 > 互联资讯 > 技术交流  > 

Vue判断数组内是否存在某一项的两种方法

目录
  • Vue判断数组内是否存在某一项
    • 两种方法:
    • findIndex()和 indexOf()方法
  • VUE-判断数组中是否含有某个值
    • ①findIndex()
    • ②find()
    • ③indexOf()
    • ④filter()
    • ⑤includes()

Vue判断数组内是否存在某一项

两种方法:

findIndex()和 indexOf()方法

findIndex()顾名思义,查找符合条件的值并返回其索引(返回值为-1表示不存在满足条件的值),通过判断返回值对其进行下一步操作

indexOf()从头开始寻找是否存在符合条件的字符串,返回值为-1表示不存在

//方法一:通用
xx(Arr,date){ 
	// 返回值等于-1 说明数组Arr中不存在id为date的对象
	if( Arr.findIndex(item => item.id=== date )!==-1){
	...
	}	
}
//方法二:当数组里的对象为字符串时用这个方法更简单
xx(Arr,date){
	// 返回值等于-1 说明数组Arr中不存在id为date的对象
	if( Arr.indexOf(date)!==-1 ){
	...
	}	
}

实例

xxx(){
      const that=this;
      that.$axios.get('/get_collection_user') //axios请求
        .then((res)=>{
          that.cards = res.data  //获取cards数组
          //判断数组内是否存在数据that.storeId,如果不存在返回值为-1
          if(that.cards.findIndex(item => item.mindId=== that.storeId)!==-1){  
            that.isActive = true
          }
      })

VUE-判断数组中是否含有某个值

①findIndex()

['zahngsan','lisi','LIXIUJUAN700','WANGYIBO500'].findIndex((v)=>(v==="LIXIUJUAN700"))
// 得到的值!==-1,则存在
// 返回2,该值在数组中的位置

②find()

 
let arr =[{name:'ZS'},{name:'WW'},{name:'LS'},{name:'GT'},{name:'JP'},{name:'JP'}];
let obj =arr.find((item)=>{item.name==='JP'});
if(obj){
// 存在,返回obj={name:'JP'}
}else{
// 不存在
}

③indexOf()

['nts','stg','APP'].indexOf('nts')
// === -1 则不存在
// !== -1 则存在,返回的是该值在数组的索引 0

④filter()

 
['nts','stg','esg'].filter((m)=>(m!=='stg'));// ['nts','esg']
// 可以判断数组过滤后的长度与过滤后的长度比较

⑤includes()

['stg','nts','cds','app'].includes('app');
// true      存在
// false  不存在

到此这篇关于Vue判断数组内是否存在某一项的文章就介绍到这了,更多相关Vue判断数组内是否存在某一项内容请搜索讯客以前的文章或继续浏览下面的相关文章希望大家以后多多支持讯客!

Vue判断数组内是否存在某一项的两种方法由讯客互联技术交流栏目发布,感谢您对讯客互联的认可,以及对我们原创作品以及文章的青睐,非常欢迎各位朋友分享到个人网站或者朋友圈,但转载请说明文章出处“Vue判断数组内是否存在某一项的两种方法