vue.jsでinputがバインドできない謎のエラーが発生した

vue.jsでinputのフォームバインディングを行っていたのですが何故かバインディングができなくて以下のようなエラーがでしまいました。

TypeError: Cannot read property '_withTask' of undefined
    at Xn (vue.esm.js:6799)
    at lt (vue.esm.js:1974)
    at Array.Kn (vue.esm.js:6812)
    at C (vue.esm.js:5730)
    at k (vue.esm.js:5632)
    at C (vue.esm.js:5735)
    at k (vue.esm.js:5632)
    at C (vue.esm.js:5735)
    at a.t.nodeOps [as __patch__] (vue.esm.js:5884)
    at a.t._update (vue.esm.js:2572)

webpackでビルドしたあとのエラーなのでなにを言っているのがさっぱりわかりませんでしたが解決方法としてはinputと同時に入れていたbuttonタグのv-on:click=に紐付けているメソッドが存在していないことが原因でした。

以下の場合だとonSend3というメソッドが存在しなかったことが原因となります。

<input type="text" class="form-control" v-model="sample">
<p>{{ sample }}</p>
<button type="button" class="btn btn-outline-primary" v-on:click="onSend3">Send</button>

なぜこうなったのかはわかりませんでしたがエラー内容がわかりにくすぎる…

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください