未验证 提交 70b939b6 编写于 作者: L limeng 提交者: Gitee

update zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md.

Signed-off-by: Nlimeng <limeng208@huawei.com>
上级 d4290664
...@@ -155,9 +155,9 @@ struct ListItemExample3 { ...@@ -155,9 +155,9 @@ struct ListItemExample3 {
@State exitEndDeleteAreaString: string = "not exitEndDeleteArea" @State exitEndDeleteAreaString: string = "not exitEndDeleteArea"
@Builder itemEnd(value: number) { @Builder itemEnd(value: number) {
Row () { Row() {
Button("Del").margin("4vp") Button("Delete").margin("4vp")
.onClick( ()=> { .onClick(() => {
animateTo({ duration: 1000 }, () => { animateTo({ duration: 1000 }, () => {
let index = this.arr.indexOf(value) let index = this.arr.indexOf(value)
this.arr.splice(index, 1) this.arr.splice(index, 1)
...@@ -169,7 +169,7 @@ struct ListItemExample3 { ...@@ -169,7 +169,7 @@ struct ListItemExample3 {
build() { build() {
Column() { Column() {
List({space:10}) { List({ space: 10 }) {
ForEach(this.arr, (item) => { ForEach(this.arr, (item) => {
ListItem() { ListItem() {
Text("item" + item) Text("item" + item)
...@@ -181,21 +181,21 @@ struct ListItemExample3 { ...@@ -181,21 +181,21 @@ struct ListItemExample3 {
.backgroundColor(0xFFFFFF) .backgroundColor(0xFFFFFF)
} }
.transition({ type: TransitionType.Delete, opacity: 0 }) .transition({ type: TransitionType.Delete, opacity: 0 })
.swipeAction({end:{ .swipeAction({ end: {
builder:this.itemEnd.bind(this, item), builder: this.itemEnd.bind(this, item),
useDefaultDeleteAnimation:true, useDefaultDeleteAnimation: true,
onDelete:()=>{ onDelete: () => {
animateTo({ duration: 1000 }, () => { animateTo({ duration: 1000 }, () => {
let index = this.arr.indexOf(item) let index = this.arr.indexOf(item)
this.arr.splice(index, 1) this.arr.splice(index, 1)
}) })
}, },
deleteAreaDistance:80, deleteAreaDistance: 80,
onEnterDeleteArea:()=>{ onEnterDeleteArea: () => {
this.enterEndDeleteAreaString = "enterEndDeleteArea" this.enterEndDeleteAreaString = "enterEndDeleteArea"
this.exitEndDeleteAreaString = "not exitEndDeleteArea" this.exitEndDeleteAreaString = "not exitEndDeleteArea"
}, },
onExitDeleteArea:()=>{ onExitDeleteArea: () => {
this.enterEndDeleteAreaString = "not enterEndDeleteArea" this.enterEndDeleteAreaString = "not enterEndDeleteArea"
this.exitEndDeleteAreaString = "exitEndDeleteArea" this.exitEndDeleteAreaString = "exitEndDeleteArea"
} }
...@@ -203,6 +203,7 @@ struct ListItemExample3 { ...@@ -203,6 +203,7 @@ struct ListItemExample3 {
}) })
}, item => item) }, item => item)
} }
Text(this.enterEndDeleteAreaString).fontSize(20) Text(this.enterEndDeleteAreaString).fontSize(20)
Text(this.exitEndDeleteAreaString).fontSize(20) Text(this.exitEndDeleteAreaString).fontSize(20)
} }
...@@ -212,6 +213,5 @@ struct ListItemExample3 { ...@@ -212,6 +213,5 @@ struct ListItemExample3 {
.height('100%') .height('100%')
} }
} }
``` ```
![deleteListItem](figures/deleteListItem.gif) ![deleteListItem](figures/deleteListItem.gif)
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册