Vue.js

vue-touch-keyboardでカスタムキーボードを作る

前回の続き。 vue-touch-keyboardでカスタムキーボードを作るには、ソースコードのlayouts.jsを見ればわかります。 特にシフトキーやCapsキー用のレイアウトが必要ない場合は_metaとdefaultを定義すればOKです。 defaultは表示通りの入力で良い場合は単にそ…

vue-touch-keyboardをv-model(databind)と共存させる

Vue.js v2でソフトウェアキーボードを使おうとすると、vue-touch-keyboardが第一候補に挙がるわけですが、公式のREADMEやJSFiddleのサンプルだけではイマイチピンとこないところがあるわけです。 その典型例が「どうやってv-modelでのdatabindと共存するの?…

Vue.jsで学ぶVirtual DOM

この記事はVue.js Advent Calendar 2016の7日目(代打投稿)です。Vue.jsも2.0になってVirtual DOMが採用されたので、改めてVirtual DOMについてMVVMとの比較で考えてみます。 いきなり結論っぽい図ですが、これが分かればもうVirtual DOMは理解したといって…

【翻訳】自分の Vue アプリを 2.0 に移行し始めた件、及びこれまでに私が見つけたリソースに関する短い投稿

この記事はhttps://benjaminlistwon.com/blog/vue-20/の翻訳です。翻訳を快諾してくれたBenjaminさん、ありがとうございました。 原文のくだけた感じを残しつつ翻訳するように努めましたが、日本語がこなれていない部分もあるかと思います。そのような箇所を…

Vue.js 2.0でtwoWayなカスタムディレクティブを実装する方法

以下はvuejs-jp slackに投稿したネタですが、ここのブログにも書いておきます。先日正式リリースされたVue.js 2.0では、React.jsと同様のVirtual DOMやOne way data flowが採用され高速描画が可能となった反面、ディレクティブは大幅に機能縮小され、"twoWay…

Vue.jsでtemplateURL風機能を実現する

Vue.js が templateURL をサポートしない理由というVue.js作者自身の記事があるように、本来Vue.jsでテンプレートやWebComponent開発を行うには.vue形式でソースを記述し、vueify(browserify)かvue-loader(webpack)といったビルドツールを使うのが筋です。 …

Vue.jsでデータバインド可能な3-stateチェックボックスを作る

WEBのチェックボックスは通常チェック有・無の2-stateですが、HTML5からは中間(不定)状態を加えた3-stateのチェックボックスを簡単に作ることができます。 中間状態にするにはチェックボックスの"indeterminate"プロパティをtrueにすればよいのですが、こ…