web-dev-qa-db-ja.com

反応フックの使用時に未定義のプロパティを読み取ることができません

「未定義のプロパティ「マップ」を読み取れません」というエラーが表示されますが、理由がわかりません-「映画」が定義されていないためマップが機能しません。私が間違っていることを見ることができますか？どうもありがとう。


const Dashboard = () => {
  const discoverUrl = 'https://movied.herokuapp.com/discover';
  const [movieList, setMovies] = useState({ movies: [] });

  useEffect(() => {
    const getAllMovies = () => {
      fetch(discoverUrl)
        .then(response => response.json())
         .then(data => setMovies(data))
        }
        getAllMovies()

      }, [])

  return (
    <ul>
      {movieList.movies.map(movie => (
        <li>
          <p>{movie}</p>
        </li>
      ))}
    </ul>
  );
}

export default Dashboard```

TypeError: Cannot read property 'map' of undefined
reactjsreact-hooksuse-effect
5
Tommmm

SetMovies（data）の状態を設定すると、movieListはdataと等しくなります。したがって、movieListのmoviesプロパティが失われます（movieList.movi​​esはありません）。

したがって、このような状態を開始する

const [movieList, setMovies] = useState([]);

そしてsetMovies（data）を実行します。

または、次のように状態を設定します

setMovies({ movies: [...data] })
0
Nayan shah