問題タブ [vue-events]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
vuejs2 - vue コンポーネントで apply.daterangepicker イベントをリッスンします
クリック イベントをリッスンする方法はわかったと思いますが、bootstrap-daterangepicker
プラグインのカスタム イベントをリッスンする方法を決定しようとしています。
jquery では、通常、次のような方法でこのイベントをリッスンします。
したがって、 bootstrap-daterangepicker docsによると、私がリッスンするはずのイベントはapply.daterangepicker
.
ドキュメントに基づいてカスタムイベントを想定して、イベントを要素にバインドする必要があると考えました。
<date-range-picker v-on:apply.daterangepicker="doSomething"></date-range-picker>
したがって、私の vue コンポーネントには次のものがあります。
私はvueが初めてなので、これがどのように機能するかを整理しようとしているだけなので、日付範囲が選択されたときに日付をconsole.logできるとうれしいですが、最終的にはもっと完全なソリューションは、これが DateRangePicker 自己完結型の子コンポーネントであり、そのイベントとデータ (?) を親コンポーネントに戻すことに基づいています。
したがって、私の簡単な質問は、選択した値を console.log にするにはどうすればよいでしょうか?
最終目標の質問は、このイベントを親コンポーネントに発行して、それを使って何かを行うにはどうすればよいかということです。
アップデート
基になるhtml要素ではなく、コンポーネントへのメイン参照にイベントバインディングを配置したことに気付きました。それを変更して単純なクリックイベントを使用するだけdoSomething()
で、少なくともメソッドを起動できます。正しい方向への一歩。
更新 2
どうやらv-on:click
うまくいきますがv-on:change
、私が試した他のイベントはうまくいかないので、今は vue についてさらに混乱しています。
更新 3
this other SO questionを見つけましたが、これが正しい方法かどうかわかりません。動作しますが、重複しているようです。mounted()
updateValue() を呼び出すイベント リスナーを登録していますが、 v-on:input="updateValue($event.target.value)"
. これは正しいですか?これがイベントリスナーを複製するだけではないのはなぜですか?