5

More than 5 years have passed since last update.

@idani(井谷茂寛)

Vuetifyのv-data-tableの見出し行（ヘッダー）をドラッグ＆ドロップで並べ替える

Last updated at 2019-03-03Posted at 2019-03-03

はじめに

テーブルの見出し行（ヘッダー）をドラッグドロップして並び順を変更したいという要望

結論

drag-n-drop in Vuetify — Part IIに掲載されていたので参考にする。

こちらも行をドラッグ＆ドロップして移動させるというサンプルだけど、見出し行でも同様。
一応、vue draggableでも試したけど、躓いたので、ブログに記載のSortable.jsを利用する

See the Pen Vuetify Example Pen by Shigehiro　IDANI (@1da2) on CodePen.

5

Register as a new user and use Qiita more conveniently

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up

5