「vue-virtual-scroll-list」で1万件のデータリストに仮想スクロールを実装する

vue-virtual-scroll-listは仮想スクロールリストを実装するライブラリです。高いスクロールパフォーマンスで大量のデータリストをサポートします。リストのアイテムとコンポーネントが独立しています。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。

「Vue-Touch-Ripple」でタッチイベントにrippleを実装する

Vue-Touch-Rippleはタッチイベントにrippleを実装するライブラリです。rippleの速度や色、透過をカスタマイズすることができます。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。

「VueMindmap」でマインドマップを実装する

VueMindmapはreact-mindmapに触発されたマインドマップを実装するライブラリです。ノードを設定し、ノード同士をオブジェクトの配列で紐付けます。編集モードのオンオフやスタイルの変更、サブノートの設定を行う事ができます。

「vue-waterfall」でウォーターフォールレイアウトを実装する

「vue-waterfall」はウォーターフォールレイアウトのコンポーネントを実装するライブラリです。ウィンドウサイズの変更やwatchによる監視で、レイアウトのリフローを行う事ができます。コピペで実装できるサンプルを公開してます。

「vue-scrollto」を使ってイージングスクロールを実装する

「vue-scrollto」は、クリックイベントによって要素までイージングスクロールを実装するライブラリです。window.requestAnimationFrameを使用してアニメーションを実行するため、最高のパフォーマンスが得られます。イージングはbezier-easingを使って行われますコピペで実装できるサンプルを公開してます。

「vue-js-toggle-button」を使ってswitch ボタンを実装する

「vue-js-toggle-button」は、switchボタンを実装するライブラリです。シンプルなAPIで容易に実装ができます。スイッチの大きさや色などのカスタマイズを行うこともできます。コピペで実装できるサンプルを公開してます。

「vuejs-paginate」を使ってページネーションを実装する

「vuejs-paginate」は、ページネーションを実装するライブラリです。シンプルなAPIで提供されており、容易に実装することができます。CSSによってページネーションコンポーネントのスタイルをカスタマイズすることができます。コピペで実装できるサンプルを公開してます。

「vue-shortkey」を使ってショートカットキーを実装する

「vue-shortkey」は、ショートカットキーを実装するライブラリです。ショートカットキーによりイベントもしくはフォーカスを設定することができます。コピペで実装できるサンプルを公開してます。

「vue2-animate」を使ってtransitionのアニメーションを実装する

「vue2-animate」は、Vueの内蔵transitionにAnimate.cssを適用させてアニメーションを実装するライブラリです。アニメーションの種類は、Bounce、Fade、Rotate、Slide、Zoomで28種類あります。コピペで実装できるサンプルを公開してます。

「vue-accordion」を使ってアコーディオンメニューを実装する

「vue-accordion」はアコーディオンメニューを実装できるライブラリです。キャッチの画像を背景にタイトルと本文で構成されたメニューを実装できます。コピペで実装できるサンプルを公開してます。

「vue-upload-component」を使ってアップロードコンポーネントを実装する

「vue-upload-component」はファイルアップロードコンポーネントを実装できるライブラリです。ファイルアップロードコンポーネント、
マルチファイルアップロード、ディレクトリのアップロード、ドラッグアップロード、ディレクトリのドラッグ、同時に複数のファイルのアップロードを実装できます。コピペで実装できるサンプルを公開してます。

「Vue-multiselect」を使って万能なセレクトボックスを実装する

「Vue-multiselect」はシングルセレクト、複数選択、タグ付け、ドロップダウン、フィルタリングが実装できるライブラリです。コピペで実装できるサンプルを公開してます。