【vueエラー】Error in nextTick: “TypeError: Cannot read property ‘__ob__’ of undefined”

毎日ボチボチプログラミングをしながら生活しています。その中での技術・エラーなどの紹介をしています。

今回は、vueのエラーを紹介していきます。簡単なものでも調べてみるとわかることも多くあるので一応備忘録としてどんどんエラーを載せておきます。少しでもエラーの解決の手助けになればと思います。以前のエラーも少し関係があるので確認してみてもらうといいと思います。

今回の事象

vueの簡易アプリを作成している際に、上記のエラーが表示されました。簡単なエラーですのでちゃんと確認してみるといいと思います。

エラーとしては、以下のものが出ています。

Error in nextTick: "TypeError: Cannot read property '__ob__' of undefined"

1	Error in nextTick: "TypeError: Cannot read property '__ob__' of undefined"

該当コードがこれになります。

mounted() {
    this.$nextTick(function() {
        this.memoList.memos = JSON.parse(localStorage.getItem(this.name)) || [];
    })
},

mounted() {

this.$nextTick(function() {

this.memoList.memos = JSON.parse(localStorage.getItem(this.name)) || [];

})

今回は、nextTickを使っています。

mounted() {
     this.$nextTick(function() {
        this.memoList.memos = JSON.parse(localStorage.getItem(this.name)) || [];
     })
}

mounted() {

this.$nextTick(function() {

this.memoList.memos = JSON.parse(localStorage.getItem(this.name)) || [];

})

}

このコード内に、使っていますがエラーの理由としては、this.memList.memosのデータが空白であることがエラーの理由です。

data()内のデータの読み取り、データ書き込みの使用を確認してみてください。

nextTickを使っているところでエラーが出ているのは自明なので確認してみて下さい。

お疲れ様です。エラーは解決できたでしょうか？

私は、data()を書き込むコードが間違っていました。

書き込みがうまくいっていなかったので対象データが空白なのでエラーになりました。

他にもエラー情報等も掲載してあるので読んでみて下さい。

解決できなければ、公式を確認してみるのもいいと思います。

ひと休憩の際におすすめ記事は「【Nuxt.js】ローカル環境にてcorsの設定方法」です。時間があれば読んでみて下さい。