Vuetifyでシンプルかつ、綺麗にスタイリングされたボタンを使ってみます
VuetifyのUIコンポーネントを実際に試してみるシリーズの記事、20回目になります。
以前の記事 [Vue.js, JavaScript]クリックされた要素を特定してdata属性から情報を取得する方法 で
v-chip という、
v-btn よりも小さいサイズの押せる要素について、少しだけふれました。
その記事を書いた時、
そういえば、v-btn についてはこれまで具体的に書いていなかったことに気づきまして、
こちらの v-btn は、比較的いろいろな props を簡単に試せることもあり、
良いサンプルになるのではと思いまして、今回の記事を書くことにしました。
Vuetifyの導入方法について等は、以前の記事:
[Vue.js]Vuetify のUIコンポーネントを使ってみる[v-slide, v-caroucel編] にCDN経由での導入方法を、
[Vue.js] Vuetify を導入して Material Design をスマートに取り入れる方法 内に、CLI経由での導入方法 をご紹介しています。あわせてご覧ください。
それでは早速、次のページよりv-btnに関して、コードのご紹介および解説を行なっていきたいと思います。ぜひご覧ください。