ハマったのでメモ書き。
若干の謎は残ってるので誰か神が下りてくることを待っている。(自分でも調べてる)
###問題のソース
https://github.com/sakaku193/p_react_web/blob/branch/todo_app/src/App.js
###何が問題だったか
タイトル通りです。
すぐに反映されないため、コメントアウトしている書き方はダメです。
//NG
localStorage.setItem("todos", JSON.stringify(this.state.todos))
//OK
localStorage.setItem("todos", JSON.stringify(todos))
参考資料
[React.js] setStateしても直ちにstateは変更されない
###何が謎か
今回
todos = [...todos, newTodo]
としているが。
todos.push(newTodo)
とすると何故かNGの書き方でも意図したとおりに動いた。
React的には即反映はされないのが正しく、あえて制御しているものだと考えられるため
pushを使ってNGの書き方をするのは良くないんじゃないかと考えている。
stateは即時反映されるものではないと考えながらコードを書いていくのが良いのではないだろうか。
###謝辞
この問題が気になり、いろいろな方に聞きました。
お忙しいにも関わらずお力を貸していただきました。
おかげで様々な知見を得られました。
大変助かりました。ありがとうございます。