может ли функция parramenter использовать метод массива? - PullRequest
0 голосов
/ 17 ноября 2018

предисловие: Я все еще привыкаю к ​​ES6 и работаю над своим первым приложением React через онлайн-класс. Я поделюсь своей проблемой здесь и моим git-репозиторием для всех, кто захочет в нее разобраться. Приложение позволяет искать и упорядочивать книги в разных категориях.

Ошибка: Uncaught (in promise) TypeError: Cannot read property 'forEach' of undefined at Object.mergeShelfAndSearch (BookUtils.js:22) at Search.js:41 BookUtils.js экспортирует несколько функций в компоненты React (не знаю, как он знает, куда идти, но он работает). Компонент Search.js обрабатывает функции поиска. Во время тестирования я буду искать что-то, чего не существует (например, zzzzz). Когда я набираю что-то, что я знаю, существует, я получаю ошибку выше

Код в BookUtils.js:

export const mergeShelfAndSearch = (shelf, search) => {

    const hashTable = {};

    shelf.forEach(book => hashTable[book.id] = book.shelf);

    search.forEach(book => {
        book.shelf = hashTable[book.id] || 'none';

    });

    return search;
}

Ошибка: 'shelf.forEach'.

Код в Search.js:

 updateSearch = () => {
        if (this.state.query === "") {
            this.setState({ error: false, books: [] });
            return;

        }

        BooksAPI.search(this.state.query).then(response => {

            let newList = [];
            let newError = false;


            if (response === undefined || (response.error && response.error !== "empty query")) {
                newError = true;
            } else if (response.length) {
                newList = BookUtils.mergeShelfAndSearch(this.props.selectedBooks, response);

                newList = BookUtils.sortAllBooks(newList);

            }
            this.setState({ error: newError, books: newList });
        })
    }

Ошибка в другом случае, если задано утверждение '' mergeShelfAndSearch 'из BookUtils.js. Я попытался установить «полку» как глобальную переменную и все еще получаю ошибки, и я чувствую, что положил console.log (shelf); везде без удачи. Ниже приведена ссылка на мой репо, если кого-то достаточно. Спасибо!

https://github.com/alecb513/reactnd-project-myreads-starter-master

1 Ответ

0 голосов
/ 17 ноября 2018

Изменение

  else if (response.length) {
            newList = BookUtils.mergeShelfAndSearch(this.props.selectedBooks, response);

            newList = BookUtils.sortAllBooks(newList);

        }

Для

  else if (response.length) {
            newList = BookUtils.mergeShelfAndSearch(Array.isArray(this.props.selectedBooks) ? this.props.selectedBooks: [], response);

            newList = BookUtils.sortAllBooks(newList);

        }

Или

  else if (response.length && Array.isArray(this.props.selectedBooks)) {
            newList = BookUtils.mergeShelfAndSearch(Array.isArray( this.props.selectedBooks, response);

            newList = BookUtils.sortAllBooks(newList);

Причина, по которой вы получаете .forEach, не определена, потому что изначально this.props.selectedBooks может быть неопределенным или иметь значение null или объект. Таким образом, выполнение .forEach приведет к ошибке. Поэтому, чтобы решить проблему, проверьте, является ли он массивом, и перед передачей this.props.selectedBooks в функцию mergeShelfAndSearch. Также убедитесь, что вы отправляете массив данных в выбранные книги из родительского компонента

...