More than 3 years have passed since last update.

Nuxt.jsのライフサイクルの穴

Posted at 2021-03-27

自分がハマったこと

Nuxt.jsには様々なライフサイクルがある（参考記事）

主要なライフサイクルメソッドの順序は次の通り
middleware -> asyncData -> created -> mounted -> beforeDestroy -> destroyed

しかし、nuxt-link等で他のページに移動する（ページA→ページB）際にライフサイクルの順番は
B.middleware -> B.asyncData -> A.beforeDestroy -> A.destroyed -> B.created -> ...

のようになり、Aの持つdestroyed等が発火される前にBのmiddleware等が発火するので注意。