配列をフィルタリングし、入れ子になったオブジェクトにtrueの値が含まれているかどうかをチェックする方法

Question

私は再選択が新しく、リストをフィルタリングしようとするまでセレクタの作成に成功しています。ネストされたキー値のペア。オプションのほとんどは文字列または文字列であり、正常に動作していますが、このリストをオブジェクトの真偽値でフィルタリングする方法を理解することはできません。ここ

は私の作業セレクタは、これまでと私は思い

const getItemsVisibilityFilter = state => state.itemsVisibilityFilter 
const getItems = state => state.items 

export const getVisibleItems = createSelector(
    [getItemsVisibilityFilter, getItems], 
    (itemsVisibilityFilter, items) => { 
    switch (itemsVisibilityFilter) { 
     case 'SHOW_ALL': 
     console.log(items) 
     return items 
     case 'SHOW_DAMAGE': 
     return items.filter(item => item.tags.includes('Damage')) 
     case 'SHOW_ATTACK_SPEED': 
     return items.filter(item => item.tags.includes('AttackSpeed')) 
     case 'SHOW_LIFE_STEAL': 
     return items.filter(item => item.tags.includes('LifeSteal')) 
     default: 
     return items 
    } 
    } 
) 

をソートするためにそれを使用していますし、これは私の質問は、私が行う方法ですJSON

"1036": { 
     "stats": { 
      "FlatPhysicalDamageMod": 10 
     }, 
     "description": "<stats>+10 Attack Damage</stats>", 
     "gold": { 
      "total": 350, 
      "sell": 245, 
      "base": 350, 
      "purchasable": true 
     }, 
     "tags": [ 
      "Damage", 
      "Lane" 
     ], 
     "plaintext": "Slightly increases Attack Damage", 
     "image": { 
      "full": "1036.png", 
      "group": "item", 
      "sprite": "item0.png", 
      "h": 48, 
      "w": 48, 
      "y": 48, 
      "x": 48 
     }, 
     "sanitizedDescription": "+10 Attack Damage", 
     "maps": { 
      "8": true, 
      "10": true, 
      "11": true, 
      "12": true, 
      "14": false, 
      "16": false, 
      "18": true, 
      "19": true 
     }, 
     "into": [ 
      "3077", 
      "3123", 
      "1053", 
      "3155", 
      "3134", 
      "3133", 
      "3034", 
      "3035", 
      "3044", 
      "3052", 
      "3072", 
      "3122", 
      "3144", 
      "3252" 
     ], 
     "id": 1036, 
     "name": "Long Sword" 
    }, 

から単一の項目であるJSON "maps"オブジェクトをフィルタリングし、trueの値を持つ項目を返しますか？これが役立つ場合。 {11：：真}そう

const getItemsVisibilityFilter = state => state.itemsVisibilityFilter 
const getItems = state => state.items 

export const getVisibleItems = createSelector(
    [getItemsVisibilityFilter, getItems], 
    (itemsVisibilityFilter, items) => { 
    switch (itemsVisibilityFilter) { 
     case 'SHOW_ALL': 
     console.log(items) 
     return items 
     case 'SHOW_DAMAGE': 
     return items.filter(item => item.tags.includes('Damage')) 
     case 'SHOW_ATTACK_SPEED': 
     return items.filter(item => item.tags.includes('AttackSpeed')) 
     case 'SHOW_LIFE_STEAL': 
     return items.filter(item => item.tags.includes('LifeSteal')) 
     case 'SHOW_SUMMONERS_RIFT': 
     return items.filter(item => item.maps.includes(I don't know what or to put here to see if 11 === true)) 
     default: 
     return items 
    } 
    } 
) 

のような、これは解決策を提供するのに役立つために十分なコードがない場合には、「マップ」 - 私は、元のセレクタに追加したいことは「SHOW_SUMMONERS_RIFT」です。私に知らせてください。私はあなたがより関連性があると思うものを投稿できます。または、どこかにあるドキュメントがあれば、私はもっと読んでいるはずです...しかし、私が見つけたものは入れ子になったオブジェクトを更新することであり、値の比較については何も見つかりません。どうもありがとうございます。

解決策---私を正しい道に乗せてくれたHardik Modhaのおかげです。私はこれが最良のソリューションか、再選択、Redux、または普通のjavascript haha​​を使用するための良い方法であるかどうかはわかりませんが、ここで私が思いついたのは、入れ子オブジェクトに基づくselectorの場合です。

Object.entriesを使用して

Answer 1

は、あなただけの最初のObject.keys を使用してすべてのエントリを取得し、使用して真の価値を持っているエントリをフィルタする必要がfilter

const filtered = Object.keys(map.maps).filter((item) => map.maps[item]);

const myObject = { 
 
    "1036": { 
 
     "maps": { 
 
      "8": true, 
 
      "10": true, 
 
      "11": true, 
 
      "12": true, 
 
      "14": false, 
 
      "16": false, 
 
      "18": true, 
 
      "19": true 
 
     }, 
 
    }, 
 
    "1037": { 
 
     "maps": { 
 
      "8": false, 
 
      "10": true, 
 
      "11": true, 
 
      "12": false, 
 
      "14": false, 
 
      "16": false, 
 
      "18": true, 
 
      "19": true 
 
     }, 
 
    }, 
 
    "1038": { 
 
     "maps": { 
 
      "8": true, 
 
      "10": false, 
 
      "11": true, 
 
      "12": true, 
 
      "14": false, 
 
      "16": false, 
 
      "18": false, 
 
      "19": true 
 
     }, 
 
    }, 
 
} 
 

 
Object.keys(myObject).forEach((key) => { 
 
    const maps = myObject[key].maps; 
 
    console.log(Object.keys(maps).filter(item => maps[item])); 
 
});

Answer 2

あなたの1036.mapsを操作する必要があるだろう

case 'SHOW_SUMMONERS_RIFT': 
    const riftItems = items.filter(item => { 
     const mapKey = Object.keys(item.maps) 
     const mapValue = Object.values(item.maps) 
     if (mapKey[2] && mapValue[2] === true) { 
     return item 
     } 
     return null 
    }) 
    return riftItems 

...

（）のドキュメントから

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries 例。あなたのための

const obj = { 0: 'a', 1: 'b', 2: 'c' }; 
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ] 

例...

let workableData = Object.entries(1036.maps) 

workableData.map(ele => { ele[1] === true ? do this : do this })