【Vue】jQueryとVueを共存させる
デザインはjQueryで作られる、実装はVue.jsで行う。なんやかんやあってこの方式でwebページを作る必要が出てくることがあります。一貫していた方が作りやすいはずなのですが、なんやかんやあってこうなります。 デザインの実装の際、jQueryとVue.jsを読み込ませるとデザイン時に動いていたイベントが消える時があります。これはVueがテンプレートエンジンも兼ねていることが原因で起きがちです。例えば次の様なシナリオで起きます。 // デザイン時 HTML読み込み完了 ↓ jQueryによるイベント付与実行 ↓ 全てのHTMLに付与されるべきイベントが付与されている // 実装時 HTML読み込み中、Vue構築中 ↓ HTML読み込み完了 ↓ jQueryによるイベント付与実行 ↓ Vue構築完了。Vue内で定義されたHTML構築を持ってきて描画 特にVueでAPIの結果をHTMLの一領域
Vue.jsでjQueryと共存させる方法 - Qiita
今回、Vue.jsをなんとか覚えようと思って頑張ってみました。 巷でよく「デザイナーでもとっつきやすいVue.js」とありますが、私の場合、アニメーションなどのDOM操作を中心にjQueryを使用しているので、その場合は全然とっつきやすくはなかったです。 開発側でない為に、開発の基本的概念の知識が乏しく、Vue.jsの概念を理解したり、環境構築したり、というところでつまづいてしまいました。 であるならば、無理してまずはVue.jsで書ききる必要もなく、学習コストを下げるために一旦、Vue.jsとjQueryと併用で使いながらちょっとずつ覚えていけばいいんではないか・・・と思ったので、今回は併用する手段を紹介しようと思います。 1.VueをCDNもしくはローカルで読み込ませるパターン Vue.jsがどのように動いているかを学ぶにあたって、このパターンが一番とっつきやすかったです。 LPなどの
Vue.jsとjQueryライブラリを共存させなければいけない場合は、コンポーネントに閉じ込める。(select2版) | SAGA.TXT
禁断の融合魔術 もうjQueryなんて使いたくない！ Vue.jsや、Reactを使って脱jQueryするんだ！ こんな、言葉が叫ばれて久しい昨今、皆様どうお過ごしでしょうか？ 新しいプロジェクトでは、ほとんどが、脱jQeryを果たしていても、各フレームワークのテンプレートエンジン+jQuery+Vueが融合しているプロジェクトも実はあったりするのではないでしょうか？ または、お客様から、 「いやだ！この『ポワン』っていうアニメーションが気に入ってたんだから、このカレンダーはそのままのデザインにしてほしい！」 などの要望があり、泣く泣く、jQueryライブラリを使う事もあるかもしれません。 そんなときは、以下の方法で、なるべく被害が広がらないような、状態にしておきましょう(もちろん、Vue.jsを使用する場合は、jQueryを極力使わない選択をするのがベストです。) 対応前 mounted
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
