亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何過濾數組中的字符串?

如何過濾數組中的字符串?

慕斯709654 2021-12-02 19:43:23
我試圖搜索功能。此函數檢查具有多個字符串的嵌套數組,然后返回該數組是否有搜索詞。數組的數據結構[  {   name:'aa',   searchWords:['aa','ab','bc'] <- I want to use this array for search  },  {   name:'bb',   searchWords:['bb','bc','de'] <- I want to use this array for search  },...]我嘗試使用 indexOf 函數。但是,我無法使用下面的代碼顯示任何組件。但是我在代碼中將目標值從item.searchWords更改為item.name。有效。HTML<div className="itemWrapper">     {filterItems.map((item, idx) => (            <Item key={idx} {...item} id={idx} list={list} />      ))}</div>    Jsconst filterItems = list.filter(      (item) => item.searchWords.indexOf(searchWord) !== -1,    );我想要的結果是搜索結果實時更新。例如使用上面相同的數據結構,當用戶搜索'a'時,searchWords 'aa' 和 'ab' 返回 true 以顯示項目,非常感謝你的幫助。
查看完整描述

3 回答

?
慕哥6287543

TA貢獻1831條經驗 獲得超10個贊

您可以嘗試使用find()和includes()對象的 name 屬性,最后使用filter().


演示:


var list = [

  {

   name:'aa',

   searchWords:['aa','ab','bc'] 

  },

  {

   name:'bb',

   searchWords:['bb','bc','de']

  }

]


document.getElementById('searchWord').addEventListener('input', function(){

  console.clear();

  var filterItems = list.find(item => item.name.includes(this.value));

  filterItems = filterItems ? filterItems.searchWords : [];

  filterItems = filterItems.filter(i => i.includes(this.value));

  console.log(filterItems);

});

<input id="searchWord"/>


查看完整回答
反對 回復 2021-12-02
?
慕沐林林

TA貢獻2016條經驗 獲得超9個贊

您需要遍歷 searchWords 數組以查找它是否與搜索詞匹配。這個會工作

const filterItems = list.filter(

      (item) => item.searchWords.filter((myWord) => myWord.indexOf(searchWord)>-1)

    );


查看完整回答
反對 回復 2021-12-02
?
慕妹3146593

TA貢獻1820條經驗 獲得超9個贊

代碼的問題在于,當您使用 indexOf 時,它會嘗試查找數組是否包含單詞。例如:當您搜索 'a' 時,代碼會檢查數組中是否有任何單詞 'a' 而不是任何包含字母 'a' 的單詞。


您需要將 JS 部分更改為:


JS


const list = [{

    name: 'aa',

    searchWords: ['aa', 'ab', 'bc']

  },

  {

    name: 'bb',

    searchWords: ['bb', 'bc', 'de']

  }

];


let searchWord = "a";


const filterItems = list.filter(

  (item) => item.searchWords.filter(word => word.includes(searchWord)).length > 0

);


document.getElementById('result').innerHTML = JSON.stringify(filterItems);

<p id="result">

  </>


查看完整回答
反對 回復 2021-12-02
  • 3 回答
  • 0 關注
  • 290 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號