Vue判斷數(shù)組內(nèi)是否存在某一項(xiàng)的兩種方法
Vue判斷數(shù)組內(nèi)是否存在某一項(xiàng)
兩種方法:
findIndex()和 indexOf()方法
findIndex()顧名思義,查找符合條件的值并返回其索引(返回值為-1表示不存在滿足條件的值),通過(guò)判斷返回值對(duì)其進(jìn)行下一步操作
indexOf()從頭開始尋找是否存在符合條件的字符串,返回值為-1表示不存在
//方法一:通用
xx(Arr,date){
// 返回值等于-1 說(shuō)明數(shù)組Arr中不存在id為date的對(duì)象
if( Arr.findIndex(item => item.id=== date )!==-1){
...
}
}
//方法二:當(dāng)數(shù)組里的對(duì)象為字符串時(shí)用這個(gè)方法更簡(jiǎn)單
xx(Arr,date){
// 返回值等于-1 說(shuō)明數(shù)組Arr中不存在id為date的對(duì)象
if( Arr.indexOf(date)!==-1 ){
...
}
}實(shí)例
xxx(){
const that=this;
that.$axios.get('/get_collection_user') //axios請(qǐng)求
.then((res)=>{
that.cards = res.data //獲取cards數(shù)組
//判斷數(shù)組內(nèi)是否存在數(shù)據(jù)that.storeId,如果不存在返回值為-1
if(that.cards.findIndex(item => item.mindId=== that.storeId)!==-1){
that.isActive = true
}
})VUE-判斷數(shù)組中是否含有某個(gè)值
①findIndex()
['zahngsan','lisi','LIXIUJUAN700','WANGYIBO500'].findIndex((v)=>(v==="LIXIUJUAN700")) // 得到的值!==-1,則存在 // 返回2,該值在數(shù)組中的位置
②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 則存在,返回的是該值在數(shù)組的索引 0④filter()
['nts','stg','esg'].filter((m)=>(m!=='stg'));// ['nts','esg'] // 可以判斷數(shù)組過(guò)濾后的長(zhǎng)度與過(guò)濾后的長(zhǎng)度比較
⑤includes()
['stg','nts','cds','app'].includes('app');
// true 存在
// false 不存在到此這篇關(guān)于Vue判斷數(shù)組內(nèi)是否存在某一項(xiàng)的文章就介紹到這了,更多相關(guān)Vue判斷數(shù)組內(nèi)是否存在某一項(xiàng)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue項(xiàng)目中props傳值時(shí)子組件檢測(cè)不到的問(wèn)題及解決
這篇文章主要介紹了Vue項(xiàng)目中props傳值時(shí)子組件檢測(cè)不到的問(wèn)題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-08-08
Vue+ElementUI table實(shí)現(xiàn)表格分頁(yè)
這篇文章主要為大家詳細(xì)介紹了Vue+ElementUI table實(shí)現(xiàn)表格分頁(yè),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-12-12
vue 實(shí)現(xiàn)Web端的定位功能 獲取經(jīng)緯度
這篇文章主要介紹了vue 實(shí)現(xiàn)Web端的定位功能獲取經(jīng)緯度,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-08-08
vue結(jié)合echarts繪制一個(gè)支持切換的折線圖實(shí)例
這篇文章主要介紹了vue結(jié)合echarts繪制一個(gè)支持切換的折線圖實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10
淺談基于Vue.js的移動(dòng)組件庫(kù)cube-ui
這篇文章主要介紹了基于Vue.js的移動(dòng)組件庫(kù)cube-ui,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-12-12

