Vuetifyのv-app-bar-nav-iconのハンバーガーメニューのデザインを変えたいとき
今回はVuetifyのv-app-bar-nav-iconのハンバーガーメニューのデザインを変えたいときどのようにすれば良いのかについてご紹介いたします。
Vuetifyのv-app-bar-nav-iconのハンバーガーメニューのデザインを変えたいとき
Vuetifyでハンバーガーメニューを表示させたいとき、v-app-bar-nav-iconタグを使います。
|
1 |
<v-app-bar-nav-icon></v-app-bar-nav-icon> |
しかし、v-app-bar-nav-iconタグを使うとデフォルトのハンバーガーメニューのマークを使わなければならず、ハンバーガーメニューのデザインを変えたいときもあると思います。
Vuetifyでもハンバーガーメニューのデザインを変えることが可能です。
例として次のようにv-imgを使って書きましょう。
|
1 2 3 4 5 6 7 8 9 |
<div> <v-img :src="require('./画像の相対パス')" contain width="××" alt="○○○" @click="drawer = true" /> </div> |
この記事が参考になればと思います。
終わりに
今回はVuetifyのv-app-bar-nav-iconのハンバーガーメニューのデザインを変えたいときどのようにすれば良いのかについてご紹介いたしました。