diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/deleteListItem.gif b/zh-cn/application-dev/reference/arkui-ts/figures/deleteListItem.gif
index 955894df1d71715edfcc84b77305af387d89b692..5c2c529ef670b83df2e4bd261bbddfe6bca7e7ef 100644
Binary files a/zh-cn/application-dev/reference/arkui-ts/figures/deleteListItem.gif and b/zh-cn/application-dev/reference/arkui-ts/figures/deleteListItem.gif differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
index c62846007c8b5cb1f44bf768eac1bad3f93c691f..5ad6a79ca4d822e6a36ef59d1f33c069db2a8139 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
@@ -155,9 +155,9 @@ struct ListItemExample3 {
   @State exitEndDeleteAreaString: string = "not exitEndDeleteArea"
 
   @Builder itemEnd(value: number) {
-    Row () {
-      Button("Del").margin("4vp")
-        .onClick( ()=> {
+    Row() {
+      Button("Delete").margin("4vp")
+        .onClick(() => {
           animateTo({ duration: 1000 }, () => {
             let index = this.arr.indexOf(value)
             this.arr.splice(index, 1)
@@ -169,7 +169,7 @@ struct ListItemExample3 {
 
   build() {
     Column() {
-      List({space:10}) {
+      List({ space: 10 }) {
         ForEach(this.arr, (item) => {
           ListItem() {
             Text("item" + item)
@@ -181,21 +181,21 @@ struct ListItemExample3 {
               .backgroundColor(0xFFFFFF)
           }
           .transition({ type: TransitionType.Delete, opacity: 0 })
-          .swipeAction({end:{
-            builder:this.itemEnd.bind(this, item),
-            useDefaultDeleteAnimation:true,
-            onDelete:()=>{
+          .swipeAction({ end: {
+            builder: this.itemEnd.bind(this, item),
+            useDefaultDeleteAnimation: true,
+            onDelete: () => {
               animateTo({ duration: 1000 }, () => {
                 let index = this.arr.indexOf(item)
                 this.arr.splice(index, 1)
               })
             },
-            deleteAreaDistance:80,
-            onEnterDeleteArea:()=>{
+            deleteAreaDistance: 80,
+            onEnterDeleteArea: () => {
               this.enterEndDeleteAreaString = "enterEndDeleteArea"
               this.exitEndDeleteAreaString = "not exitEndDeleteArea"
             },
-            onExitDeleteArea:()=>{
+            onExitDeleteArea: () => {
               this.enterEndDeleteAreaString = "not enterEndDeleteArea"
               this.exitEndDeleteAreaString = "exitEndDeleteArea"
             }
@@ -203,6 +203,7 @@ struct ListItemExample3 {
           })
         }, item => item)
       }
+
       Text(this.enterEndDeleteAreaString).fontSize(20)
       Text(this.exitEndDeleteAreaString).fontSize(20)
     }
@@ -212,6 +213,5 @@ struct ListItemExample3 {
     .height('100%')
   }
 }
-
 ```
 ![deleteListItem](figures/deleteListItem.gif)
\ No newline at end of file