Vue判斷數(shù)組內是否存在某一項的兩種方法
更新時間：2023年07月11日 11:37:05 作者：椿?
這篇文章主要介紹了Vue判斷數(shù)組內是否存在某一項,今天給大家分享兩種方法，分別是findIndex()和 indexOf()方法，本文結合實例代碼給大家介紹的非常詳細，需要的朋友可以參考下
Vue判斷數(shù)組內是否存在某一項
兩種方法：
findIndex（）和 indexOf（）方法
findIndex（）顧名思義，查找符合條件的值并返回其索引（返回值為-1表示不存在滿足條件的值），通過判斷返回值對其進行下一步操作
indexOf（）從頭開始尋找是否存在符合條件的字符串，返回值為-1表示不存在
//方法一:通用
xx(Arr,date){
// 返回值等于-1 說明數(shù)組Arr中不存在id為date的對象
if( Arr.findIndex(item => item.id=== date )!==-1){
...
}
}
//方法二：當數(shù)組里的對象為字符串時用這個方法更簡單
xx(Arr,date){
// 返回值等于-1 說明數(shù)組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數(shù)組
//判斷數(shù)組內是否存在數(shù)據(jù)that.storeId，如果不存在返回值為-1
if(that.cards.findIndex(item => item.mindId=== that.storeId)!==-1){
that.isActive = true
}
})VUE-判斷數(shù)組中是否含有某個值
①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ù)組過濾后的長度與過濾后的長度比較
⑤includes（）
['stg','nts','cds','app'].includes('app');
// true 存在
// false 不存在到此這篇關于Vue判斷數(shù)組內是否存在某一項的文章就介紹到這了,更多相關Vue判斷數(shù)組內是否存在某一項內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要為大家詳細介紹了vue組件父與子通信詳解，實現(xiàn)登錄窗口，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11
vue開發(fā)中的base和publicPath的區(qū)別
本文主要介紹了vue開發(fā)中的base和publicPath的區(qū)別,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2024-07-07
vue中用js如何實現(xiàn)循環(huán)可編輯表格
這篇文章主要介紹了vue中用js如何實現(xiàn)循環(huán)可編輯表格，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
這篇文章主要給大家介紹了如何使用Vue2實現(xiàn)簡單的購物車功能,文中有相關的代碼示例,對我們的學習或工作有一定的幫助,需要的朋友可以參考下2023-08-08
本文給大家分享的是個人在使用vue.js制作的文章和評論的分頁組件，并使用webpack打包起來，這里推薦給大家，有需要的小伙伴可以參考下2016-06-06
這篇文章主要介紹了vue-cli項目中遇到的eslint的坑及解決，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
最近在開發(fā)自己的富文本編輯器插件，在開發(fā)中遇到了很多問題其中我覺得比較好的問題就是在你定義的插件中實現(xiàn)雙向綁定。這篇文章主要介紹了vue插件實現(xiàn)v-model功能,需要的朋友可以參考下2018-09-09
這篇文章主要介紹了vue 開發(fā)企業(yè)微信整合,結合具體案例形式分析了vue.js使用企業(yè)微信JSSDK實現(xiàn)手機端程序可以和企業(yè)微信進行整合功能的相關操作技巧,需要的朋友可以參考下2019-12-12
這篇文章主要介紹了vue-cli3.0 腳手架搭建項目的過程，本文分步驟給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2018-10-10
在做文字處理的項目時經(jīng)常會遇到搜索文字并高亮的需求,本文就來介紹vue 指定文字高亮的實現(xiàn)示例,具有一定的參考價值,感興趣的可以了解一下2023-12-12