WordPressのカテゴリーの階層構造を維持してくれるプラグイン
「Parent Category AutoCheck + Category Tree Checklist」を使って、Wordpressの投稿を保存した後、投稿の編集画面を開くと、チェックされたカテゴリが一番上に表示され、カテゴリ階層が壊れている「機能」を削除します。
Vue.jsでお手軽にパララックスを実装できる「vue-inview」
vue-inviewは、お手軽にパララックスを実装できるライブラリです。animate.cssを使うことで、76種類のアニメーションを実装することが可能です。もちろん色を変えたり背景を変えたりなどのオリジナルアニメーションを実装することもできます。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
年表で使えるタイムラインを「hzqing-vue-timeline」で実装する
hzqing-vue-timelineは、年表などで良く用いられる縦型のタイムラインを実装するコンポーネントライブラリです。レスポンシブデザインにも対応しており、背景色やコンテンツ欄の色を自由に変更することが可能です。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
Vue.jsのLightboxは「vue-image-lightbox」で簡単に実装できる
vue-image-lightboxは、Vue.jsで作られたLightboxライブラリです。キャプションの設定はもちろん、自動スクロール機能も内蔵されています。他にも気の利いた機能がたくさんあります。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
数値入力スピナーを「vue-number-input- spinner」で実装する
vue-number-input- spinnerは、最大値最小値の設定ができる数値入力スピナーコンポーネントライブラリです。独自のClassを設定できたり、ステップ入力を行うことも可能です。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
MacのFinderみたいなメニューを「vue finder」で実装する
vue finderは、MacのFinderみたいなメニューを実装できるコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
ツリーチャートを簡単に実装できる「Vue-Tree-Chart」
Vue-Tree-Chartは、ツリーチャートを簡単に実装できるコンポーネントライブラリです。JSON形式のデータを取り込む事で、ツリー構造の図を作成することができます。折りたたみの開閉なども行うことが可能です。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
クルクル回るインフォカード「VueInfoCard」
VueInfoCardは、マウスホーバーをするとクルクルと回転して裏側を表示するインフォカードコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
スワイプするスイッチを「vue-swipe-button」で実装する
vue-swipe-buttonは、スマホみたいにスワイプするスイッチを実装できるコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
「Vue Moveable」を使って要素を回したり、伸ばしたりする
Vue Moveableは、要素を回したり、伸ばしたり、ドラッグしたり、ピンチしたりできるコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
入力を１文字ずつに分割するフォームを「vue-fake-input」で実装する
vue-fake-inputは、入力を１文字にずつに分割したフォームを実装できるコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
「vue-draggable-nested-tree」でドラッグ要素をツリー形式で配置する
vue-draggable-nested-treeは、ドラッグ要素をツリー形式に配置することが可能なdraggable&droppableコンポーネントです。tree-helper.js を使用することで、折りたたみを実装することも可能です。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
「vue-sweetalert-icons」でSweetAlertのアイコンを利用する
vue-sweetalert-iconsは、SweetAlertのステータスアイコン用のVueラッパーコンポーネントライブラリです。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
【2019年10月】Vue.jsライブラリ記事まとめ
毎日は見てられない人向けの2019年10月のVue.jsライブラリの紹介記事まとめです。
Stripeのようなメニューを「vue-stripe-menu」で実装する
vue-stripe-menuは、オンライン決済のStripeのメニューのようなものを実装することができるコンポーネントライブラリです。
モバイル対応や、水平グループメニュー、直列グループメニューも可能です。。簡単に実装できるコピペと触って体感できるサンプルを掲載しています。
VeeValidateのクロスフィールドのカスタムルール設定方法（v3系）
VeeValidate公式ドキュメントのカスタムルールの設定方法が理解しづらすぎたので、見直すことが無いように設定方法を記事に残しておこうと思います。今回は別のフィールドと比較検証するクロスフィールドカスタムルールの設定方法を記事にしようと思います。
VeeValidateのカスタムルールの設定方法（v3系）
VeeValidate公式ドキュメントのカスタムルールの設定方法が理解しづらすぎたので、見直すことが無いように設定方法を記事に残しておこうと思います。
![[ライブラリ不要]ファイルのmultipleアップロードの画像をプレビューする](https://www.kabanoki.net/wp-content/uploads/2019/10/108460bc4ebcd1b0608a00be1c6dd4a9.png)
[ライブラリ不要]ファイルのmultipleアップロードの画像をプレビューする
ライブラリを使わずにJavascriptだけでファイルのアップロード前に画像を確認する方法のmultiple プロパティを設定した場合の記事を書きました。
触って試せるサンプルも掲載しています。