转场动画forEach循环添加回调函数添加index为啥全部触发了?
/**
* 转场动画(组件)transition
* 需要配合animateTo才能生效
*
*/
@Entry
@Component
struct TransitionTest2 {
@State numbers: Object[] = []
startNumber: number = 6;
build() {
Column({ space: 10 }) {
Scroll() {
Column({ space: 10 }) {
ForEach(this.numbers, (item,index) => {
// ForEach下的直接组件需配置transition效果
Row() {
Text(item.text + item.id)
.height(40)
.backgroundColor(Color.Orange).layoutWeight(1)
// Button('删除').type(ButtonType.Normal).onClick(()=>{
// animateTo({},()=>{
// this.numbers.splice(index,1)
// })
// })
}
.transition({ type: TransitionType.All, translate: { x: 200 }, scale: { x: 0, y: 0 } })
}, item => item.id)
}
.margin(10)
// .justifyContent(FlexAlign.Start)
// .alignItems(HorizontalAlign.Center)
.width("90%").height('100%')
}.layoutWeight(1).backgroundColor(Color.Green)
Row(){
Button('头部添加')
.onClick(() => {
animateTo({ duration: 1000 }, () => {
// 往数组头部插入一个元素,导致ForEach在头部增加对应的组件
this.numbers.unshift({ text: '文档', id: this.startNumber.toString() });
this.startNumber++;
})
})
Button('尾部添加')
.onClick(() => {
animateTo({ duration: 1000 }, () => {
// 往数组尾部插入一个元素,导致ForEach在尾部增加对应的组件
this.numbers.push({ text: '文档', id: this.startNumber.toString() });
this.startNumber++;
})
})
Button('删除头部')
.onClick(() => {
animateTo({ duration: 1000 }, () => {
// 删除数组的头部元素,导致ForEach删除头部的组件
this.numbers.shift();
})
})
Button('删除尾部')
.onClick(() => {
animateTo({ duration: 1000 }, () => {
// 删除数组的尾部元素,导致ForEach删除尾部的组件
this.numbers.pop();
})
})
}
}
.width('100%')
.height('100%')
.backgroundColor(Color.Pink)
}
}
UI
forEach循环
赞
收藏 0
回答 1
待解决
相关问题
求告知子窗口如何添加动画
432浏览 • 1回复 待解决
HarmonyOS http请求,只触发了headersReceive,没有触发dataReceive
34浏览 • 1回复 待解决
#鸿蒙学习大百科#如何监听RichEditor添加完成粘贴前可触发的回调?
219浏览 • 1回复 待解决
#鸿蒙学习大百科#如何监听RichEditor添加完成剪切前可触发的回调?
203浏览 • 1回复 待解决
#鸿蒙学习大百科#如何监听RichEditor添加完成复制前可触发的回调?
258浏览 • 1回复 待解决
鸿蒙卡片添加到桌面会触发哪个方法呢?
6348浏览 • 1回复 待解决
服务中心添加卡片怎么添加?
6439浏览 • 1回复 待解决
ForEach无法遍历全部数据,是什么原因
1925浏览 • 1回复 待解决
HarmonyOS Text如何知道触发了TextOverflow.Ellipsis
30浏览 • 1回复 待解决
如何添加内容的添加渐变模糊
345浏览 • 1回复 待解决
组件被隐藏后 onVisibleAreaChange 事件触发了两次
2053浏览 • 1回复 待解决
#鸿蒙学习大百科#如何监听RichEditor添加图文变化前和图文变化后可触发的回调?
244浏览 • 1回复 待解决
HarmonyO foreach循环,数据变化了,界面没有刷新
334浏览 • 1回复 待解决
HarmonyOS 在一个Row/Column里,通过循环往里面添加数据
54浏览 • 1回复 待解决
复杂类型foreach循环,关于复杂类型的循环渲染有哪些?
750浏览 • 1回复 待解决
如何实现动画转场效果
843浏览 • 1回复 待解决
使用转场动画时,如何在消失转场动画完成时执行其他操作
2119浏览 • 1回复 待解决
鸿蒙工程可以添加.so 文件吗?怎么添加?
2799浏览 • 1回复 待解决
forEach循环中,编译报错:Not all code paths return a value
838浏览 • 1回复 待解决
ForEach循环渲染的过程是什么样的
838浏览 • 1回复 待解决
如何全局设置页面转场动画
743浏览 • 1回复 待解决
Tabs 出现/消失转场动画效果
392浏览 • 1回复 待解决
list添加或删除item需要设置入场出场动画典型案例
902浏览 • 1回复 待解决
添加候选网络配置,使用有关能力接口添加候选网络配置
773浏览 • 1回复 待解决
buttom样式怎么添加?
6553浏览 • 2回复 待解决
没太看明白问题是什么