2024年11月17日 / 最終更新日時 : 2024年12月8日 admin Vue.js（主にNuxt.jsとVuetify）

(Vuetify3)v-autocomplete：無駄なAPIリスクエストをせずにサジェストを表示する

v-autocompleteをVuetify2からVuetify3に移行してみました。選択肢に選択している値が無くても表示されるようなったり、イベントが整理され、mousedownやchange、blurを使って頑張 […]

2023年12月30日 / 最終更新日時 : 2023年12月30日 admin Vue.js（主にNuxt.jsとVuetify）

Vuetify3のv-data-tableの開閉(expand)で複数行の表示・非表示を切り替える

Vuetify2で作成した、v-data-table：ボタンクリック(expand)で複数行の内訳の表示・非表示を切り替えるをVuetify3で動くように直します。 Slots（Vuetify2ではexpanded-i […]

2023年11月26日 / 最終更新日時 : 2023年12月24日 admin Vue.js（主にNuxt.jsとVuetify）

v-data-tableがv3.4.0でリリースされました。あとは、v-calendarだけが残っているようです。→ Introduction to Labs — Vuetify 以前、Vuetify Labsので暫定 […]

2023年10月19日 / 最終更新日時 : 2023年10月20日 admin Vue.js（主にNuxt.jsとVuetify）

markdown-itをVuetifyの環境に導入してデザインを整えるでhighlight.jsを導入しましたが、テーマ（lightやdark）毎にimportするCSSを切り替えられるようにしていなかった。時間掛か […]

2023年10月17日 / 最終更新日時 : 2023年11月2日 admin Vue.js（主にNuxt.jsとVuetify）

markdown-itの導入は公式を参考にすれば問題なくできますが、Pluginが多くて時間が掛かるのと、Vuetifyの環境に入れると、間隔が狭まったり位置がズレたりするので、demoページを参考にlayoutや他のペ […]

2023年10月12日 / 最終更新日時 : 2023年11月29日 admin Vue.js（主にNuxt.jsとVuetify）

Vuetify3のv-data-tableは、まだ開発中でリリースされていない。 → Vuetify3でリリースされたv-data-tableにアップデートする仕様が変わる可能性はありますが、Vuetify Labsで […]

2023年9月12日 / 最終更新日時 : 2023年11月23日 admin Vue.js（主にNuxt.jsとVuetify）

Vuetify2からVuetify3で仕様が変わって、デザインが崩れたり表示が変わったりしているので対応して行きます。アップグレードガイドと各APIやコンポーネントのページを確認しながら進めるのが良いのですが、手間なの […]

2023年9月10日 / 最終更新日時 : 2023年11月23日 admin Vue.js（主にNuxt.jsとVuetify）

Vuetifyの移行していなかった設定（nuxt.config.jsで設定していたテーマ・色）を設定します。調整しやすいように確認ページも作りました。前回：Nuxt BridgeをNuxt3に移行。ヘッダタイトルとエ […]

2023年8月25日 / 最終更新日時 : 2023年11月24日 admin Vue.js（主にNuxt.jsとVuetify）

VuetifyもVue3に対応（一部除く）したようなので、Nuxt BridgeからNuxt3へのアップグレードしてみました。変更が多くかなり大変なので、何回かに分けてナレッジをメモしていきます。対象は、Nuxt.j […]

2023年7月7日 / 最終更新日時 : 2024年11月17日 admin Vue.js（主にNuxt.jsとVuetify）

選択肢が少ない場合はセレクトボックス(v-select)で良いのですが、数が多い場合はサジェスト(suggest)して選択させた方が良いですよね。候補はいくつかありますが、最終的にv-autocompleteを使用する […]