JavaScript Sortable 是一個用于對列表進行排序的庫，它非常靈活且易于使用。它可以處理動態數據，即可以在運行時向列表中添加、刪除或修改數據。
要處理動態數據，您可以使用 Sortable 的 update 方法。當列表發生變化時（例如，通過拖放操作），您可以調用此方法來更新排序。
以下是一個簡單的示例，演示了如何使用 Sortable 處理動態數據：
HTML:
<ul id="sortableList">
<li data-id="1">Item 1</li>
<li data-id="2">Item 2</li>
<li data-id="3">Item 3</li>
</ul>
JavaScript:
const sortableList = document.getElementById('sortableList');
const sortable = new Sortable(sortableList, {
onUpdate: function (event) {
// 獲取排序后的列表項
const sortedItems = Array.from(sortableList.children);
// 根據排序后的列表項更新數據源
const data = sortedItems.map(item => {
return {
id: item.getAttribute('data-id'),
text: item.textContent
};
});
console.log(data);
}
});
在這個示例中，我們創建了一個具有三個列表項的無序列表。每個列表項都有一個 data-id 屬性，用于存儲其數據。我們使用 Sortable 庫對列表進行排序，并在排序發生變化時調用 onUpdate 方法。在 onUpdate 方法中，我們獲取排序后的列表項，并根據它們更新數據源。
