Nuxt.jsで「TypeError: Cannot set property ‘render’ of undefined」のコソールエラー対処法

エラー内容 Nuxt.jsで開発中、以下のコンソールエラーが出て画面が表示されなくなった。 原因と対処法 <script>タグの閉じタグがなかったり、空の<script>タグが存在しているとエラーとなるため、 …

$nextTickでタイミングを遅延させて子コンポーネントにアクセスする

mountedやupdatedを使用してもでは子コンポーネントを全てをマウントしたことは保証しないため、子コンポーネントへアクセスがうまくいかない時がある。 そこ解決するために、$nextTickを使用してDOMの更新サ …

【Nuxt.js コンポーネント間の循環参照】Unknown custom elementとなる原因と解決方法

Nuxt.jsで開発中に以下のエラーが出てハマった。 エラーメッセージにあるように、nameオプションで指定してもダメだった。 今回の場合、原因はコンポーネント間の循環参照の記述方法だった。 Vue.jsのドキュメントの …

【初心者向け】Nuxt.jsでのVuexのクラシックモードとモジュールモードについて

Nuxt.jsで状態管理を行うライブラリであるVuexのクラシックモードとモジュールモードについて説明。 まず、新規Nuxtプロジェクトを作成 以下、コマンドでテスト用にNuxtプロジェクトを作成しておく。 初期設定をど …

カスタムコンポーネントでのv-modelの動作について。中身の:valueと@inputを理解する

v-modelは双方向データバインディングを行うディレクティブであるが、カスタムコンポーネントでv-modelを使う場合、少しややこしい。 v-modelの中身の動作について まず、v-modelには、別の書き方がある。 …