
Material Design Iconsというサイトがある。
ここから探す。(アイコンは英語で検索)
例えばごみ箱のアイコンならtrashと検索する。
好きなアイコンを選択すると、
import { mdiTrashCanOutline } from '[@mdi/js](https://www.npmjs.com/package/@mdi/js)';
こんな風に出てくる。
書き替え方
上記の例なら、
mdiTrashCanOutline
の大文字の前にハイフンを入れて、そのうえで小文字の表記に書き替えて使う。
↓書き換え後
mdi-trash-can-outline
↓Vuetify公式の説明 この説明でわかんのか…
v-icon
コンポーネントは、アプリケーションのさまざまな側面にコンテキストを提供するために、グリフの大きなセットを提供します。 利用可能なすべてのアイコンの一覧については、公式の Material Design Icons
ページをご覧ください。 これらのアイコンのいずれかを使用するには、単純にmdi-
プレフィックスに続いて アイコン名を使用します。
Vuetify - A Material Design Framework for Vue.js
使い方
ボタンとして使いたいならこんな感じになる。
<v-btn icon>
<v-icon>mdi-trash-can-outline</v-icon>
</v-btn>