Vuetify
#Vuetify_DataTable #Material_Design #Vue.js #Vueity_style
マテリアルデザインコンポーネントフレームワーク — Vuetify.js
https://vuetifyjs.com/ja/components/api-explorer
実際にcomponentの例があるし、
sourceも見せてくれるし、
githubへのリンクもあるし、codepenで動作確認もできる。
APIを検索できるし、
プラモデル制作みたいになってきてる..
V-App componet + Vue.js router で使う際には、
vue-router を使用する場合は、ビューを v-main の中に配置することをお勧めします
Application service — Vuetify
Vuetify.js - vue,vue-routerでページ遷移できない。|teratail
非常に親切な回答がある。
<router-view>を使う。
Tutorial:
Traversy Mediaの Build a Calendar With Vue, Vuetify & Firebase - YouTube を見る予定
個別:
グリッドシステム — Vuetify
container, row, col, spacer(均等配置のためのスペーサー? gutter, margin, padding)
Vuetify DataTable
File input component — Vuetify
Calendar
管理画面系のパーツは一通りあるし、管理画面用のテーマ?も売ってる。$100以下もある。
developerからのresource
Vuetify v2+.pptx - Google スライド
#2: John Leider - creator of Vuetify by Distinguished Devs
styles
grid systemは Flexbox
icons:
Vuetify comes bootstrapped with support for Material Design Icons, Material Icons, Font Awesome 4 and Font Awesome 5. By default, applications will default to use Material Design Icons.
参考:
Vuetify 2.0の注目機能とNuxt.jsでの試し方 - Qiita
Nuxt.jsの場合
対応してました!
→ nuxt-community/vuetify-module: Vuetify Module for Nuxt.js