Как создать двумерный массив в state и заполнить его?

Question

[bpGusar]

Как создать двумерный массив в state и заполнить его с помощью цикла?

Answer 1

[Максим]

Создаете: ссылка (RU)

Затем с помощью setState записываете... например:

...
state = {
  myData: []
}
...

this.setState({ myData: [[1,2,3],[4,5,6],[7,8,9]] })

Comments

[bpGusar]

есть стейт

state = {
        arrResult: []
    };

Есть запрос к API и создание массива названий фильмов в стейте

searchMovie = async () => {
        const searchQuery = document.getElementById("movieName").value;
        const movieCall = await fetch(`https://api.themoviedb.org/3/search/movie?api_key=${API_KEY}&language=ru-RU&query=${searchQuery}&include_adult=true`);
        data = await movieCall.json();
        this.state.arrResult = [];
        for (let i = 0; i < data.results.length; i++) {
            this.setState({
                arrResult: [...this.state.arrResult, data.results[i].title]
            });
        }
    };

Там в json приходит ответ вида

[
"results": [
    {
      "title": "Неуловимые мстители",
      "genre_ids": [
        28,
        12,
        10751
      ]
    },
]

Тут есть жанры genre_ids, как мне в стейт к каждому фильму добавить еще и список id жанров?

[Антон Спирин]

bpGusar, Вот эта конструкция сама по себе нелогична:

this.state.arrResult = [];
for (let i = 0; i < data.results.length; i++) {
  this.setState({
    arrResult: [...this.state.arrResult, data.results[i].title]
  });
}

Вы сначала в обход API React подменяете ссылку на массив, что по-хорошему делать нельзя.
А потом зачем то выполняете проход по массиву и каждую итерацию вызываете setState заставляя компонент выполнить обновление.
Более того вы еще и пишите в массив только title.
Вот исправленный вариант:

searchMovie = async () => {
  const searchQuery = document.getElementById("movieName").value;
  const { results } = await fetch(`https://api.themoviedb.org/3/search/movieapi_key=${API_KEY}&language=ru-RU&query=${searchQuery}&include_adult=true`)
    .then(res => res.json());
        
  this.setState({ arrResult: results });
};

Подтяните основы JavaScript.