Wait a moment...

Reactでハマったエラーの対処法

nem1.70xem (2)
221
0
2019-10-08 17:49:06
Reactでハマったエラーの対処法

久しぶりに風邪を引いてしばらく大人しくしていました。

その間に細々とreactの勉強をしていたのですが、今回は練習のためにreactでTodoリストを作成していた時にハマったエラーと対処法をメモしときたいと思います。

 

 

○TypeError: Cannot read property '***' of undefined

これはリストの削除機能を作る時にハマりました。

そのまま翻訳すると「未定義のプロパティ「***」を読み取れません」といった感じなんですが、これはちゃんと定義されていないことが問題なようなのでアロー関数で書いてあげれば治りました。

 

before)

removeTask(text){
        var updatedTasks = this.state.tasks;
        updatedTasks.splice(updatedTasks.indexOf(text), 1);
        this.setState({tasks: updatedTasks});
}

 

after)

removeTask=(text)=>{
        var updatedTasks = this.state.tasks;
        updatedTasks.splice(updatedTasks.indexOf(text), 1);
        this.setState({tasks: updatedTasks});
}
 
こんな感じでちゃんと渡してあげたらスッと治りました。
 
 

○Cannot read property 'map' of undefined

このエラーはほとんど普通にタイプミスです。私の場合は「var tasksList=[];」を「tasks=tasksList」に定義し直していたのを忘れて「tasksList」で進めてしまっていたのでエラーが出たといった感じでした。

 

 

○まとめ

どちらもしょうもないミスなんですが、結構ハマった時間が長かったのでもし困っている方の助けになれたら嬉しいです。

この記事を書いた人
趣味は読書(特に太宰治)、アニメ鑑賞(特に幾原作品)、旅行。 エンジニア見習い。 日々の色々を共有しながらnemのことについても学びたいと思います。