鸿蒙原生 ArkTS 布局实战List 滑动删除SwipeToDelete完全指南一、引言在移动应用开发中滑动操作Swipe Action已经成为用户最熟悉的交互手势之一。无论是 iOS 的 Mail 应用中滑动标记已读还是微信中滑动删除聊天记录滑动操作为用户提供了一种快捷、直观、高效的交互方式避免了长按菜单或进入编辑模式的繁琐步骤。HarmonyOS NEXT 作为华为全场景智能生态的操作系统在其原生声明式 UI 框架 ArkTS 中提供了极其优雅的滑动操作 API——.swipeAction()。通过这个 API开发者可以轻松地为 List 列表项添加左右滑动面板实现删除、收藏、标记等常见操作。本篇文章将从一个完整的实战项目出发带你从零掌握 ArkTS 中 List 滑动删除的完整实现。全文将涵盖ArkTS 项目结构与页面路由List 组件的基础使用.swipeAction()API 的详细参数解析Builder与Component在滑动面板中的正确用法ArkTS 数据模型与状态管理的注意事项常见编译错误与解决方案从 API 23 升级到 API 24 的适配要点二、项目背景与环境配置2.1 开发环境要求在开始之前请确保你的开发环境满足以下条件环境项要求操作系统Windows 10/11 或 macOS开发工具DevEco Studio 5.0SDK 版本HarmonyOS SDK API 247.0.0语言版本ArkTS基于 TypeScript 5.0目标设备HarmonyOS NEXT 模拟器或真机2.2 API 版本升级说明23 → 24本项目的初始模板使用的是 API 23SDK 6.1.0但本文所有代码均已适配API 24SDK 7.0.0。升级到 API 24 后主要变化包括编译规则更严格对类型检查、空安全等有更细粒度的管控废弃 API 标记部分 API如promptAction.showToast标记为 deprecated推荐迁移到新的ohos.arkui.dialog模块性能优化List 组件的懒加载和复用机制有底层改进在build-profile.json5中确认 SDK 版本配置{ app: { products: [ { name: default, targetSdkVersion: 7.0.0(24), compatibleSdkVersion: 7.0.0(24), runtimeOS: HarmonyOS } ] } }2.3 项目结构概览一个标准的 HarmonyOS NEXT 工程结构如下ap06/ ├── AppScope/ # 应用全局配置 │ └── app.json5 # 应用名称、图标等元信息 ├── entry/ # 模块目录 │ ├── src/main/ │ │ ├── ets/ │ │ │ ├── entryability/ # Ability 生命周期 │ │ │ │ └── EntryAbility.ets # 应用入口负责加载页面 │ │ │ └── pages/ │ │ │ ├── Index.ets # 默认页面Hello World │ │ │ └── SwipeToDeleteDemo.ets # 我们的滑动删除页面 │ │ └── resources/ # 资源文件 │ └── build-profile.json5 # 模块构建配置 ├── build-profile.json5 # 项目级构建配置 └── oh-package.json5 # 包管理配置2.4 页面路由注册在 HarmonyOS NEXT 中所有页面都需要在main_pages.json中注册。我们添加了新页面后需要编辑entry/src/main/resources/base/profile/main_pages.json{src:[pages/Index,pages/SwipeToDeleteDemo]}然后修改EntryAbility.ets中的启动页面// 将默认的 pages/Index 改为我们的新页面windowStage.loadContent(pages/SwipeToDeleteDemo,(err){if(err.code){hilog.error(DOMAIN,testTag,Failed to load the content. Cause: %{public}s,JSON.stringify(err));return;}hilog.info(DOMAIN,testTag,Succeeded in loading the content.);});三、核心技术List .swipeAction()3.1 List 组件概述List是 ArkTS 提供的高性能列表容器它支持懒加载只渲染可视区域内的列表项大量数据时依然流畅复用机制离屏的 ListItem 会被回收复用减少内存开销方向控制支持垂直默认和水平两种滚动方向粘性标题支持分组列表的粘性标题sticky header滑动操作通过.swipeAction()为每一项添加滑动面板基本用法List() { ForEach(this.dataArray, (item: DataType) { ListItem() { // 你的列表项内容 Text(item.title) } }, (item: DataType) item.id.toString()) } .width(100%) .height(100%)3.2 .swipeAction() API 深度解析.swipeAction()是ListItem组件的方法用于为列表项添加滑动操作面板。它的完整签名如下ListItem() .swipeAction(value: SwipeActionOptions)其中SwipeActionOptions接口的定义为interfaceSwipeActionOptions{start?:SwipeActionItem;// 起始侧面板LTR 布局中为左侧/向右滑end?:SwipeActionItem;// 结束侧面板LTR 布局中为右侧/向左滑edgeEffect?:SwipeEdgeEffect;// 滑动到边缘的弹性效果}interfaceSwipeActionItem{builder:CustomBuilder;// 面板的 UI 构建函数必须为 BuilderonAction?:()void;// 面板被触发时的回调offset?:number;// 面板偏移量}参数详解参数类型必填说明startSwipeActionItem否用户向右滑动时从左侧露出的操作面板。常用于删除、置顶等操作endSwipeActionItem否用户向左滑动时从右侧露出的操作面板。常用于收藏、更多等操作edgeEffectSwipeEdgeEffect否滑动到边缘时的效果Spring弹簧回弹或None无效果builderCustomBuilder是面板内容的构建器必须使用Builder装饰的函数onAction() void否滑动面板被触发时的回调函数关于 CustomBuilder 的重要约束这是 ArkTS 初学者最容易踩的坑。.swipeAction()的builder属性类型为CustomBuilder它不接受Component结构体只能接受用Builder装饰的函数。错误写法❌ 编译报错.swipeAction({ start: { builder: DeleteButton() // ❌ DeleteButton 是 Component不能赋值给 CustomBuilder } })正确写法✅ 正常工作Builder deleteButtonBuilder(item: NotificationItem) { Button(删除) .onClick(() { this.deleteItem(item); }) } // 在 ListItem 中 .swipeAction({ start: { builder: (): void this.deleteButtonBuilder(item) } })这里还有一个细节builder需要用箭头函数包裹Builder的调用即(): void this.deleteButtonBuilder(item)而不是直接传递this.deleteButtonBuilder(item)。这是因为 CustomBuilder 需要延迟执行在滑动触发时才构建 UI。3.3 SwipeEdgeEffect 弹性效果edgeEffect: SwipeEdgeEffect.Spring // 推荐SwipeEdgeEffect.Spring提供了类似 iOS 的弹簧回弹效果当用户滑动面板超出边界时面板会像弹簧一样回弹带来更自然的物理手感。如果设置为SwipeEdgeEffect.None则滑动到边界会直接停止显得生硬。四、数据模型设计ArkTS 注意事项4.1 类的定义在 ArkTS 中定义数据模型时有一个重要的语法限制不能在构造函数的参数中直接声明并赋值字段。// ❌ 错误写法arkts-no-ctor-prop-declsclassNotificationItem{constructor(publicid:number,publictitle:string,publiccontent:string){}}// ✅ 正确写法先声明字段再在构造函数中赋值classNotificationItem{id:number0;// 必须提供默认值title:string;content:string;constructor(id:number,title:string,content:string){this.idid;// 在构造函数体中进行赋值this.titletitle;this.contentcontent;}}4.2 State 装饰器与响应式数据State是 ArkTS 中最核心的装饰器之一。被State修饰的变量当其值发生变化时框架会自动重新渲染与之绑定的 UI。State private notifications: NotificationItem[] [ new NotificationItem(1, 系统更新提醒, 您的系统已更新至 HarmonyOS NEXT 5.0...), // ...更多数据 ];当你调用this.notifications.splice(index, 1)删除一项后State会检测到数组变化List 会自动移除对应的列表项并更新界面。无需手动刷新这是声明式 UI 的核心优势。五、实战代码解析下面我们逐段解析SwipeToDeleteDemo.ets的核心代码。5.1 页面入口与布局结构Entry Component struct SwipeToDeleteDemo { State private notifications: NotificationItem[] [ /* 6条数据 */ ]; build() { Column() { TitleBar({ title: List 滑动删除演示 }); // 顶部标题栏 TipBanner(); // 操作提示横幅 List() { /* 列表内容 */ } // 核心列表 BottomActionBar({ onReset: () this.resetList() }) // 底部重置按钮 } } }整个页面采用从上到下的 Column 布局分为四个区域TitleBar蓝色的标题栏显示页面名称TipBanner橙色的操作提示条告诉用户滑动手势的方向List占据剩余空间的核心列表区域BottomActionBar底部的重置按钮5.2 列表与滑动操作的绑定这是整个应用的核心代码List() { ForEach(this.notifications, (item: NotificationItem) { ListItem() { NotificationCard({ item: item }) } .height(80) .swipeAction({ // ← 核心绑定滑动操作 start: { // 向右滑动 → 左侧露出删除 builder: (): void this.deleteButtonBuilder(item) }, end: { // 向左滑动 → 右侧露出收藏 builder: (): void this.favoriteButtonBuilder(item) }, edgeEffect: SwipeEdgeEffect.Spring // 弹性回弹效果 }) }, (item: NotificationItem) item.id.toString()) // key 生成器 }关键细节每个ListItem独立绑定.swipeAction()互不干扰ForEach的第三个参数是key 生成器使用item.id.toString()确保列表项的唯一标识。当列表数据变化时框架通过 key 来识别哪些项需要增、删、移而不是全部重新渲染。这是高性能列表的关键height(80)统一设置每个列表项的高度为 80vp5.3 Builder 构建滑动面板Builder deleteButtonBuilder(item: NotificationItem) { Button(删除) .width(80) .height(100%) .backgroundColor(#FF3B30) // iOS 风格的红色 .fontColor(Color.White) .fontSize(16) .fontWeight(FontWeight.Medium) .borderRadius(0) // 直角与列表项融为一体 .onClick(() { this.deleteItem(item); // 点击执行删除 }); } Builder favoriteButtonBuilder(item: NotificationItem) { Button(收藏) .width(80) .height(100%) .backgroundColor(#007AFF) // 蓝色 .fontColor(Color.White) .fontSize(16) .borderRadius(0) .onClick(() { this.favoriteItem(item); // 点击执行收藏 }); }设计要点按钮的.width(80)决定了滑动面板的宽度。你可以根据实际需求调整.height(100%)让按钮撑满整个 ListItem 的高度.borderRadius(0)使用直角让按钮与列表项边界完全贴合视觉上更干净Builder函数可以接受参数item: NotificationItem将当前列表项的数据传入5.4 删除与状态更新private deleteItem(item: NotificationItem): void { let index this.notifications.findIndex(n n.id item.id); if (index ! -1) { this.notifications.splice(index, 1); // 从响应式数组中移除 promptAction.showToast({ message: 已删除「${item.title}」, duration: 1500 }); } }删除的流程非常简洁通过findIndex找到要删除项在数组中的索引调用splice(index, 1)从数组中移除一项State 检测到数组变化自动触发 UI 更新showToast 给用户一个操作反馈提示5.5 重置列表private resetList(): void { this.notifications [ new NotificationItem(1, 系统更新提醒, 您的系统已更新至 HarmonyOS NEXT 5.0...), // ... 重新初始化为全部 6 条数据 ]; }resetList()将notifications数组重新赋值为初始数据。注意这里直接赋值一个新数组而不是修改原数组。State 装饰器会检测到引用变化数组地址改变从而触发全量刷新。如果只想修改数组内容而不改变引用则需要用splice、push等变异方法。六、子组件设计与复用将一个大型页面拆分为多个小的Component是 ArkTS 推荐的最佳实践。本示例将页面拆分为 4 个子组件6.1 TitleBar标题栏Component struct TitleBar { private title: string ; build() { Row() { Text(this.title) .fontSize(20) .fontWeight(FontWeight.Bold) .fontColor(Color.White) } .width(100%) .height(56) .backgroundColor(#0A59F7) // 鸿蒙品牌蓝色 .padding({ left: 20, right: 20 }) } }6.2 TipBanner操作提示条Component struct TipBanner { build() { Row() { Text( 向右滑动列表项 → 删除 | 向左滑动 → 收藏) .fontSize(13) .fontColor(#666666) .textAlign(TextAlign.Center) } .width(100%) .padding({ top: 12, bottom: 12 }) .backgroundColor(#FFEEDD) } }这个提示条虽然简单但对用户体验至关重要——用户需要被引导才知道列表项是可以滑动的。这也是移动端设计中的一个重要原则可见性Discoverability。6.3 NotificationCard通知卡片Component struct NotificationCard { private item: NotificationItem new NotificationItem(0, , ); build() { Row() { // 左侧圆形图标首字头像 Circle() .width(40).height(40) .fill(#0A59F7).opacity(0.85) .margin({ right: 14 }) .overlay(this.iconBuilder(this.item.title.charAt(0))) // 右侧文字区域 Column() { Text(this.item.title) .fontSize(16).fontWeight(FontWeight.Medium) .maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis }) Text(this.item.content) .fontSize(13).fontColor(#999999) .maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis }) .margin({ top: 4 }) } .alignItems(HorizontalAlign.Start) .layoutWeight(1) } .padding({ left: 16, right: 16 }) .backgroundColor(Color.White) .alignItems(VerticalAlign.Center) } Builder iconBuilder(char: string) { Text(char) .fontColor(Color.White).fontSize(18).fontWeight(FontWeight.Bold) } }注意Circle()的.overlay()方法同样接收CustomBuilder类型因此也需要用Builder函数构建内部的 Text。6.4 BottomActionBar底部操作栏Component struct BottomActionBar { private onReset?: () void; build() { Row() { Button( 重置列表) .width(160).height(40) .backgroundColor(#0A59F7) .fontColor(Color.White).fontSize(15) .borderRadius(20) .onClick(() { this.onReset?.(); }) } .width(100%) .height(64) .justifyContent(FlexAlign.Center) .backgroundColor(Color.White) .shadow({ radius: 4, color: #20000000 }) } }子组件通信方式BottomActionBar通过private onReset?: () void定义回调函数属性父组件在创建时传入onReset: () this.resetList()。这是 ArkTS 中父子组件通信的标准模式。七、完整代码清单以下是SwipeToDeleteDemo.ets的完整代码约 307 行/* * 滑动删除SwipeToDelete示例页面 * * 布局要点 * 1. List .swipeAction() 实现列表项滑动操作 * 2. start 参数向右滑动时在左侧展示的操作面板删除按钮 * 3. end 参数向左滑动时在右侧展示的操作面板收藏按钮 * 4. 通过 State 驱动数据变化删除后自动刷新 UI * 5. 使用 Builder 自定义构建滑动操作面板ArkTS 要求 CustomBuilder 类型 */ import { promptAction } from kit.ArkUI; // ----- 数据模型 ----- class NotificationItem { id: number 0; title: string ; content: string ; constructor(id: number, title: string, content: string) { this.id id; this.title title; this.content content; } } // ----- 主页面 ----- Entry Component struct SwipeToDeleteDemo { State private notifications: NotificationItem[] [ new NotificationItem(1, 系统更新提醒, 您的系统已更新至 HarmonyOS NEXT 5.0点击查看详情。), new NotificationItem(2, 新消息通知, 张三 回复了您的评论感谢分享), new NotificationItem(3, 应用下载完成, 《备忘录》应用已下载完成点击安装。), new NotificationItem(4, 安全提醒, 检测到异地登录建议立即修改密码。), new NotificationItem(5, 日历提醒, 您有一个会议将于 15:00 开始请准时参加。), new NotificationItem(6, 订阅更新, 您关注的专栏「鸿蒙开发实战」发布了新文章。), ]; build() { Column() { TitleBar({ title: List 滑动删除演示 }) TipBanner() List() { ForEach(this.notifications, (item: NotificationItem) { ListItem() { NotificationCard({ item: item }) } .height(80) .swipeAction({ start: { builder: (): void this.deleteButtonBuilder(item) }, end: { builder: (): void this.favoriteButtonBuilder(item) }, edgeEffect: SwipeEdgeEffect.Spring }) }, (item: NotificationItem) item.id.toString()) } .width(100%) .layoutWeight(1) .backgroundColor(Color.Transparent) BottomActionBar({ onReset: () this.resetList() }) } .width(100%) .height(100%) .backgroundColor(#F5F5F5) } Builder deleteButtonBuilder(item: NotificationItem) { Button(删除) .width(80).height(100%) .backgroundColor(#FF3B30) .fontColor(Color.White).fontSize(16) .fontWeight(FontWeight.Medium).borderRadius(0) .onClick(() { this.deleteItem(item); }); } Builder favoriteButtonBuilder(item: NotificationItem) { Button(收藏) .width(80).height(100%) .backgroundColor(#007AFF) .fontColor(Color.White).fontSize(16).borderRadius(0) .onClick(() { this.favoriteItem(item); }); } private deleteItem(item: NotificationItem): void { let index this.notifications.findIndex(n n.id item.id); if (index ! -1) { this.notifications.splice(index, 1); promptAction.showToast({ message: 已删除「${item.title}」, duration: 1500 }); } } private favoriteItem(item: NotificationItem): void { promptAction.showToast({ message: 已收藏「${item.title}」, duration: 1500 }); } private resetList(): void { this.notifications [ new NotificationItem(1, 系统更新提醒, 您的系统已更新至 HarmonyOS NEXT 5.0点击查看详情。), new NotificationItem(2, 新消息通知, 张三 回复了您的评论感谢分享), new NotificationItem(3, 应用下载完成, 《备忘录》应用已下载完成点击安装。), new NotificationItem(4, 安全提醒, 检测到异地登录建议立即修改密码。), new NotificationItem(5, 日历提醒, 您有一个会议将于 15:00 开始请准时参加。), new NotificationItem(6, 订阅更新, 您关注的专栏「鸿蒙开发实战」发布了新文章。), ]; promptAction.showToast({ message: 列表已重置, duration: 1000 }); } } Component struct TitleBar { private title: string ; build() { Row() { Text(this.title).fontSize(20).fontWeight(FontWeight.Bold).fontColor(Color.White) } .width(100%).height(56).backgroundColor(#0A59F7).padding({ left: 20, right: 20 }) } } Component struct TipBanner { build() { Row() { Text( 向右滑动列表项 → 删除 | 向左滑动 → 收藏) .fontSize(13).fontColor(#666666).textAlign(TextAlign.Center) } .width(100%).padding({ top: 12, bottom: 12 }).backgroundColor(#FFEEDD) } } Component struct BottomActionBar { private onReset?: () void; build() { Row() { Button( 重置列表).width(160).height(40) .backgroundColor(#0A59F7).fontColor(Color.White).fontSize(15).borderRadius(20) .onClick(() { this.onReset?.(); }) } .width(100%).height(64).justifyContent(FlexAlign.Center) .backgroundColor(Color.White).shadow({ radius: 4, color: #20000000 }) } } Component struct NotificationCard { private item: NotificationItem new NotificationItem(0, , ); build() { Row() { Circle().width(40).height(40).fill(#0A59F7).opacity(0.85) .margin({ right: 14 }) .overlay(this.iconBuilder(this.item.title.charAt(0))) Column() { Text(this.item.title).fontSize(16).fontWeight(FontWeight.Medium) .maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis }).width(100%) Text(this.item.content).fontSize(13).fontColor(#999999) .maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis }).width(100%) .margin({ top: 4 }) } .alignItems(HorizontalAlign.Start).layoutWeight(1) } .width(100%).height(100%) .padding({ left: 16, right: 16 }).backgroundColor(Color.White) .alignItems(VerticalAlign.Center) } Builder iconBuilder(char: string) { Text(char).fontColor(Color.White).fontSize(18).fontWeight(FontWeight.Bold) } }八、常见编译错误与解决方案在实际开发过程中ArkTS 编译器会比标准 TypeScript 更加严格。以下是我们踩过的坑和解决方案8.1 ERROR: arkts-no-ctor-prop-declsERROR: Declaring fields in constructor is not supported (arkts-no-ctor-prop-decls)原因ArkTS 不支持 TypeScript 中的构造函数参数属性简写即constructor(public id: number)这种写法。解决方案在类体中先声明所有字段并提供默认值然后在构造函数体中逐个赋值。// ✅ 正确 class Item { id: number 0; constructor(id: number) { this.id id; } } // ❌ 错误 class Item { constructor(public id: number) {} }8.2 ERROR: CustomBuilder 类型不匹配ERROR: Type DeleteButton is not assignable to type CustomBuilder原因.swipeAction()的builder属性要求CustomBuilder类型但直接传入了一个Component结构体的实例。解决方案将滑动面板的定义从Component改为Builder函数。// ✅ 正确 Builder deleteButtonBuilder(item: Item) { Button(删除).onClick(() { this.deleteItem(item); }) } // ❌ 错误 .swipeAction({ start: { builder: DeleteButton() } })8.3 ERROR: overlay 参数类型不匹配ERROR: Argument of type TextAttribute is not assignable to parameter of type string | CustomBuilder原因Circle().overlay()方法接受CustomBuilder类型但直接链式调用.fontColor()等 Text 属性方法返回的是TextAttribute与CustomBuilder不兼容。解决方案同样使用Builder函数构建 overlay 内容。// ✅ 正确 Circle() .overlay(this.iconBuilder(char)) Builder iconBuilder(char: string) { Text(char).fontColor(Color.White).fontSize(18) } // ❌ 错误 Circle() .overlay(Text(char).fontColor(Color.White))8.4 警告: showToast 已废弃WARN: showToast has been deprecated.原因在 API 24 中promptAction.showToast()已被标记为 deprecated推荐迁移到新的 Toast API。解决方案对于 API 24 及以上版本推荐使用ohos.arkui.dialog模块中的showToast方法// API 24 推荐方式 import { showToast } from ohos.arkui.dialog; // 使用 showToast({ message: 已删除, duration: 1500 });不过promptAction.showToast()在 API 24 中仍然可以正常工作只是会有编译警告。如果你暂时不想迁移可以在build-profile.json5的strictMode中配置忽略 deprecated 检查或者简单地继续使用旧 API——不会影响功能。九、扩展与最佳实践9.1 多按钮滑动面板当需要在滑动面板中放置多个按钮时可以使用Row布局Builder multiActionBuilder(item: NotificationItem) { Row() { Button(置顶).width(60).height(100%).backgroundColor(#FF9500) .onClick(() { this.pinItem(item); }) Button(标记).width(60).height(100%).backgroundColor(#007AFF) .onClick(() { this.markItem(item); }) Button(删除).width(60).height(100%).backgroundColor(#FF3B30) .onClick(() { this.deleteItem(item); }) } }9.2 确认删除对话框为了防止误删除可以在点击删除按钮时弹出确认对话框import { AlertDialog } from kit.ArkUI; private confirmDelete(item: NotificationItem): void { AlertDialog.show({ title: 确认删除, message: 确定要删除「${item.title}」吗, primaryButton: { value: 取消, action: () {} }, secondaryButton: { value: 删除, fontColor: #FF3B30, action: () { this.deleteItem(item); } } }); }9.3 性能优化数据量大时的考量当列表数据超过 100 条时建议使用 LazyForEach替代 ForEach实现真正的虚拟列表避免复杂的 Builder中的嵌套组件保持滑动面板的轻量化合理设置 ListItem 的高度尽量固定高度以优化复用效率// 大数据量时推荐使用 LazyForEach List() { LazyForEach(this.dataSource, (item: Item) { ListItem() { ItemView({ item: item }) } .swipeAction({ /* ... */ }) }, (item: Item) item.key) }9.4 无障碍访问Accessibility为滑动按钮添加无障碍标签方便视障用户使用Button(删除) .accessibilityText(删除此通知) .accessibilityDescription(点击后将从此列表中移除该条通知)十、总结本文通过一个完整的实战项目详细讲解了在 HarmonyOS NEXT 中使用 ArkTS 实现List 滑动删除SwipeToDelete的全部技术细节。核心要点回顾知识点核心内容List 组件高性能列表容器支持懒加载和复用.swipeAction()ListItem 的滑动操作 API支持 start/end 双方向Builder 与 Component滑动面板必须使用 BuilderCustomBuilder不能用 ComponentState 响应式数据修改 State 数组自动触发 UI 刷新ForEach key 生成器为每个列表项提供唯一 key优化 Diff 效率ArkTS 语法约束构造函数不能参数声明字段overlay 需要 Builder适用场景邮件列表中的滑动标记已读/删除聊天列表的滑动删除/置顶待办事项应用的滑动完成/删除文件管理器的滑动更多操作任何需要快捷操作的列表界面项目源码本项目的完整代码位于entry/src/main/ets/pages/SwipeToDeleteDemo.ets已通过 API 24 编译验证。你可以直接将其导入到 DevEco Studio 中运行体验滑动删除的流畅交互。附录参考资源HarmonyOS 官方文档 - List 组件HarmonyOS 官方文档 - .swipeAction() APIArkTS 语法规范State 装饰器文档Builder 装饰器文档本文由 AtomCode (deepseek-v4-flash) 基于实际项目编译验证生成。博客文件路径Blog_SwipeToDelete_HarmonyOS_NEXT.md