Реагировать на массивы полезной нагрузки фильтра - PullRequest
Новая
       69

Реагировать на массивы полезной нагрузки фильтра

0 голосов
/ 26 февраля 2019

Мне нужна помощь в фильтрации массива различных значений. Я использую React.Заранее спасибо !!!

У меня есть полезная нагрузка, которая содержит 3 различных типа массивов, каждый тип массива имеет следующие значения ключа.

myPayload: array (3) 

  0: {name: “John “ , age: “24” , height: “174cm” , **type:
   “student”**}.
  1: {name: “Jane”  , age: “49” , height: “168cm” ,**type: “teacher”**}
  2: { name: “schoolName” , country: “UnitedStated” , state: “IL”, 
   **type:”building”**}

Карты типа "ученик" и "учитель" содержат те же поля, но карточка "здания" имеет поля, отличные от других.

Я отображаю массивы в виде карт, и моя цель заключается в возможности поиска по всем значениям массивов / карт.

Это то, что у меня есть в моем cards.reducer

import { FILTER_CARDS, FETCH_CARDS } from '../X/Y';

const initialState = { myPayload: [], filteredPayload: [] };

    export default function (state = initialState, action) {
        const { type, myPayload = [], value } = action;
        const handler = {
            [FETCH_CARDS]: {
                ...state,
                myPayload,
            },
            [FILTER_CARDS]: {
                ...state,
                filteredPayload: state.myPayload.filter(({ name }) => name.toLowerCase().match(value)),
            },
        };

        return handler[type] || state;
    }

Вышеуказанное фильтрует только через поле «имя» каждой карты.

Я попытался отфильтровать все значения (имя, возраст, рост, тип, schoolName, страна, штат), внеся изменения в «FILTER_CARDS», но это приводит к ошибке

"невозможно прочитать свойство 'toLowerCase' из неопределенного" 

[FILTER_CARDS]: {
            ...state,
            filteredPayload: (state.myPayload.type == ('student' || 'teacher')
                    ? (state.myPayload.filter(({ name }) => name.toLowerCase().match(value)),
                    state.myPayload.filter(({ age }) => age.toLowerCase().match(value)),
                    state.myPayload.filter(({ height }) => height.toLowerCase().match(value)))
                    : (state.myPayload.filter(({ name }) => name.toLowerCase().match(value)),
                    state.myPayload.filter(({ country }) => country.toLowerCase().match(value)),
                    state.assetsPayload.filter(({ state }) => state.toLowerCase().match(value)))),
        },

какие-либо сведения о том, как отфильтровать все значения в этом сценарии?

Ответы [ 2 ]

0 голосов
/ 28 февраля 2019

Я решил это, выполнив следующее 

filteredPayload: state. myPayload.filter(item => {
                switch (item.type) {
                case 'building':
                    return (
                        item.name.toLowerCase().match(value)
                            || item.country.toLowerCase().match(value)
                            || item.state.toLowerCase().match(value)
                    );
                case 'student':
                case 'teacher':
                    return (
                        item.name.toLowerCase().match(value)
                            || item.age.toLowerCase().match(value)
                            || item.height.toLowerCase().match(value)
                    );
                }

                return item;
            }),

Спасибо всем за помощь ^ _ ^

0 голосов
/ 26 февраля 2019

Вы можете просто искать в значениях объекта, так что вам не нужно заботиться о именах ключей. 

filteredPayload: state.myPayload.filter(item => (
  Object.values(item).some(objValue => (
    objValue.toLowerCase().match(value)
  ))
))
...