TypeError: Cannot read property 'map' of undefined

Question

現状

npm startターミナルで行うと

TypeError: Cannot read property 'map' of undefined

このようなエラーが出ています。

該当するコード

AnswersList
src/components/AnswersList.jsx:6
  3 | 
  4 | const AnswersList = (props) => {
  5 |   return (
> 6 |     <div className="c-grid__answer">
  7 |       {props.answers.map((key, index) => {
  8 |         return <Answer answer={props.answers[index]} key={index.toString()} select={props.select} />
  9 |       })}

このようなエラーが出ていて、コードがこちらになります.

import React from 'react';
import {Answer} from './index'

const AnswersList = (props) => {
  return (
    <div className="c-grid__answer">
      {props.answers.map((key, index) => {
        return <Answer answer={props.answers[index]} key={index.toString()} select={props.select} />
      })}
    </div>
  );
};

export default AnswersList;

このようになっています

React初心者でこのコードがみないと解決できないコードがありましたら、
追加で編集させていただきますので教えていただけると
幸いです。
宜しくお願いいたします。。。

Answer 1

TypeError: Cannot read property 'map' of undefined

どちらかといえばAnswersListを呼び出している側からしっかりanswersが渡されていないことが原因のように思えます。
呼び出し側でanswersに相当する変数をconsole.logなどで確認して、目的の値(mapを使っているのでこの場合なにかしらの配列)となっているかどうか調べてみるといいと思います。

Comments

[退会済みユーザー]

コメントありがとうございます！
AnswersList.jsxのファイルでconsole.logをしながら調べていくという認識でよろしいでしょうか？

[nekoniki]

いえ、親コンポーネントで
<AnswerList answers={hogehoge} />
としている箇所の方がよいかと思います。
上記の例のhogehogeがどうなっているかを見た方がいいです。

[退会済みユーザー]

ありがとうございます！

また何かありましたら宜しくお願い致します！！！！