react не выводит массив

382
27 апреля 2017, 15:36

вот код:

render() {
    console.log(this.state.catalog.products);
    if (this.state.catalog.products) {
        return (
            this.state.catalog.products.map((item) =>
                <div>
                    {item.description}
                </div>
            )
        );
    } else {
        return (
            <div>Загрузка...</div>
        );
    }
}

его вывод выводит ошибку такого рода: A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.

Массив, который я пытаюсь вывести:

Answer 1

React не умеет выводить массивы без контейнера (во всяком случае пока). return должен возвращать один(!) DOM Элемент или null. Вы же возвращаете несколько DOM элементов. Вам необходимо обернуть вывод в какой-нибудь контейнер, например div или span. Или даже сократить код таким образом:

render() {
    return this.state.catalog.products
        ? (
            <div>{this.state.catalog.products.map((item) =>
                <div>
                    {item.description}
                </div>
            )}</div>
        )
        : <div>Загрузка...</div>;
}

Еще вариант

render() {
    return <div>{
        this.state.catalog.products
            ? this.state.catalog.products.map((item) =>
                <div>
                    {item.description}
                </div>
            )
            : 'Загрузка...'
        }</div>;
}
Answer 2

Оберните вот это вот

this.state.catalog.products.map((item) =>
            <div>
                {item.description}
            </div>

в теги <див> и <закр.див>

READ ALSO
Вставить HTML код в ячейку с помощью Javascript
javascript

Вставить HTML код в ячейку с помощью Javascript

Доброго времени суток, прошу, помогите решить проблему, у меня есть скрипт, который берет данные из этих инпутов:

 477
Прелоадер для главной страницы
jQuery

Прелоадер для главной страницы

Есть главная страница и несколько внутреннихНа главной странице есть прелоадер, который корректно отображается

 281
JQuery: select by id, но не в странице, а в элементе
jQuery

JQuery: select by id, но не в странице, а в элементе

ГосподаУ меня такая конструкция на странице: два вложденных div'а:

 253
Совмещение таблицы и карты
CSS

Совмещение таблицы и карты

Нужно выводить сгруппированную по координатам информацию в таблице (или лучше heatmap из highcharts) на картуТо есть, у меня есть table или div с определённой...

 217