Реагировать на поиск по ключу объекта - PullRequest
0 голосов
/ 03 августа 2020

Я пытаюсь создать метод поиска для поиска по массиву объектов.

Вот что у меня получилось.

searchItemInput = (text) => {
    const search = text;
    const results = Lodash.filter(this.state.itemSearch, (item) => {
        return item.id.indexOf(search) > -1;
    });
    text.length > 0 ? this.setState({ item: results }) : this.setState({ item: [] });
}

Это структура данных

Object {
  "id": "-M86doz_Xnd2nJyJtkNm",
  "image": "image",
  "link": "link",
  "source": "source",
  "title": "title",
}

Вместо этого я ищу поиск по заголовку объекта, поэтому то, что я пробовал, изменяет item.id.indexOf(search) на item.title.indexOf(search), но при этом появляется сообщение об ошибке item.title is undefined

Ответы [ 3 ]

0 голосов
/ 03 августа 2020
searchItemInput = (text) => {
    const searchTitle = text;
    const results = this.state.itemSearch.find(item => item.title === searchTitle);
    
    searchTitle.length > 0 ? this.setState({ item: results }) : this.setState({ item: [] });
}

Вам не нужно использовать библиотеку loda sh для выполнения базовых c вычислений, таких как find. Вероятно, вам следует использовать searchTitle вместо text, чтобы дать больше контекста относительно того, каким должно быть значение string.

Как упомянул Кайл выше, find даст вам первое появление и filter даст вам их все (вы отфильтровываете те, которые не совпадают, что, в свою очередь, дает вам их все.

0 голосов
/ 03 августа 2020

Хорошо, это было глупо :) как указал Адига, я получал ошибку, потому что некоторые элементы имели title undefinded. Удаление этих элементов из базы данных устранило проблему. Думаю, двигаясь дальше, я должен проверить, имеют ли элементы свойства udefined, и, если это правда, удалить их из отфильтрованного массива.

Рабочий метод

searchItemInput = (text) => {
    const search = text;
    const results = this.state.itemSearch.filter((item) => {       
       return item.title.indexOf(search) > -1;
    });
    search.length > 0 ? this.setState({ item: results }) : this.setState({ item: [] });
}
0 голосов
/ 03 августа 2020

Чтобы найти первый экземпляр Используйте .find ()

searchItemInput = (text) => {
    const search = text;
    const results = this.state.itemSearch.find(item => item.title === text);
    
    text.length > 0 ? this.setState({ item: results }) : this.setState({ item: [] });
}

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

Чтобы найти все

searchItemInput = (text) => {
    const search = text;
    const results = this.state.itemSearch.filter(item => item.title === text);

    text.length > 0 ? this.setState({ item: results }) : this.setState({ item: [] });
}
...