Реагировать - Div существует, но пуст и больше проблем - PullRequest
0 голосов
/ 16 ноября 2018

Я использую приведенный ниже код, чтобы получить список данных из файла JSON, чтобы заполнить веб-страницу News. Однако, с тем, что у меня есть, div пусто, когда я проверяю это, и я не уверен почему. Когда я пытаюсь найти другое решение, я получаю ошибки или такой же вывод.

const newsList = labNewsJson['news']

class News extends Component {
  render() {
    const news = newsList.map((newsItem) => {
      <div>{newsItem}</div>
    });

    return (
      <div className='container'>
        <h1>Lab News</h1>
        <div>{news}</div>
      </div>
    );
  }
}

export default News;

Ответы [ 2 ]

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

Когда вы используете {}, функция map ничего не возвращает. У вас есть два варианта:


1 - Попробуйте использовать () вместо {}:

const news = newsList.map((newsItem) => (
    <div>{newsItem}</div>
))

2 - возвращать элемент на каждой итерации:

const news = newsList.map((newsItem) => {
    return <div>{newsItem}</div>
})
0 голосов
/ 16 ноября 2018

Вам необходимо добавить возврат к функции карты.

const news = newsList.map((newsItem, index) => {
  return <div key={index}>{newsItem.title}</div>
});
...