Vue.jsでthis.$emit(‘update:〇〇’, ××)はタイムラグがありそう

今回はVue.jsでthis.$emit(‘update:〇〇’, ××)で親コンポーネントのプロパティを更新する際にタイムラグがありそうということをお話ししていきます。



Vue.jsでthis.$emit(‘update:〇〇’, ××)はタイムラグがありそう

Vue.jsでthis.$emit(‘update:〇〇’, ××)を使おうとした時です。

具体的には上記の〇〇部分の変数を初期化しようとしましたが、this.$emitで指定した親コンポーネントの変数が初期化されませんでした。

下記のようにconsole.logを差し込んで変数の中身を確かめてみても、値が更新されているようには見えません。

色々条件を変更して検証したところ、どうやらthis.$emit(‘update:〇〇’, ××)にはタイムラグがあるようです。

処理の最後に〇〇の変数の初期化を試したらきちんと値が初期化されることが確認できました。
this.$emit(‘update:〇〇’, ××)を使うときは気をつけましょう。

終わりに

今回はVue.jsでthis.$emit(‘update:〇〇’, ××)で親コンポーネントのプロパティを更新する際にタイムラグがありそうということをお話しいたしました。

最後までお読みいただきありがとうございます。
ブログやTwitterでのシェアOKです。
コメントもお待ちしております。
誤植や勘違いなどございましたらコメント欄にて教えていただけると幸いです。






Vue.js

Posted by ちこ