HarmonyOS NEXT應用開發案例——列表編輯實現

介紹

本示例介紹用過使用ListItem組件屬性swipeAction實現列表左滑編輯效果的功能。 該場景多用於待辦事項管理、文件管理、備忘錄的記錄管理等。

效果圖預覽

使用說明：

• 點擊添加按鈕，選擇需要添加的待辦事項。
• 長按待辦事項，點擊刪除後，被勾選待辦事項被刪除。
• 左滑單個待辦事項，點擊刪除按鈕後，當前待辦事項被刪除。

實現步驟

1. List組件綁定@State修飾的數組變數toDoData。
2. ListItem組件設置左滑動效swipeAction 屬性，使得單個ListItem可以進行左右滑動，並顯示自定義的UIBuilder。 屬性。
3. 觸發點擊事件新增/刪除列表項，更新數組變數toDoData，並同時更新List組件UI(MVVM)，具體可參考代碼文件ToDoList。

高性能知識點

不涉及

工程結構&模塊類型

pendingitems                                    // har
|---model
|   |---ToDo.ets                                // TODO類定義
|   |---ConstData.ets                           // 常量數據
|---pages
|   |---ToDoList.ets                            // 列表項功能增刪實現頁面
|   |---ToDoListItem.ets                        // 列表項頁面

模塊依賴

不涉及

參考資料

ListItem