Vue.jsでドラッグ＆ドロップリスト

Vue.js 2.1.10でやってみる

https://github.com/yaasita/vuejs-dad-box

並び変え終わったらdragendで

var request_url = "https://hogehogehoge"
var req = new XMLHttpRequest();
req.open('POST', request_url, false);
req.setRequestHeader("Content-Type", "application/json");
req.send(JSON.stringify(this.boxes));

とかやってどっかに飛ばす
んで後ろ側で

$sort_json = json_decode(file_get_contents("php://input"),true);

とかやって受けた
実際は毎回更新させるのは重いだろうし、交換したDOM二つだけをjsonに乗せるとか工夫の余地あり

参考リンク

• 多分Vue.js 1 時代のやつ
  • Vue.jsのリストレンダリングとhtml5のドラッグ＆ドロップの実装
• ネイティブ HTML5 ドラッグ＆ドロップ