前提・実現したいこと
Reactでaxios通信を行いLaravelからDBの情報を取得する。
発生している問題・エラーメッセージ
Uncaught TypeError: Cannot read property 'id' of undefined
該当のソースコード
react
1const [user, setUser] = useState([]); 2const getUser = async () => { 3 const response = await axios.get(`/api/user/${props.match.params.username}`); 4 setUser(response.data) 5} 6console.log(user[0].id);
試したこと
まず、Laravelのコントローラーで戻り値を確認してみました。
local.DEBUG: [{"id":1,"screen_name":"@test_user1","name":"TEST1","profile_image":"https://placehold.jp/50x50.png","email":"test1@test.com","email_verified_at":null,"created_at":"2020-05-13T13:25:08.000000Z","updated_at":"2020-05-13T13:25:08.000000Z"}]
一応、DBから取得できています。
次にReact側で確認しました。
react
1console.log(user[0]); 2{id: 1, screen_name: "@test_user1", name: "TEST1", profile_image: "https://placehold.jp/50x50.png", email: "test1@test.com", …}
きちんと配列が入っています。
次にこの配列からidを取得しようとしたところ次のようなエラーがでました。
react
1console.log(user[0].id); 2Uncaught TypeError: Cannot read property 'id' of undefined
なぜ、idはあるのにundefinedになっているいのかがわかりません。
補足情報(FW/ツールのバージョンなど)
同じプロジェクトで
react
1const[item,setItem]=useState([{id:1,name:"バナナ"}]) 2console.log(item[0].id);
とやってみたらエラーはでず、ログでは1とあったので動作することは確認済みです。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。