HarmonyOS 鸿蒙Next 二维数组更新删除二维数组下item 没有刷新怎么解决?
HarmonyOS 鸿蒙Next 二维数组更新删除二维数组下item 没有刷新怎么解决?
this.childList[1].articles?.splice(index, 1)
可以试下按引用传递参数去刷新UI
https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-builder-0000001774119930#ZH-CN_TOPIC_0000001857916801__按引用传递参数
可以先参考下面这个方法:
可以通过引入三方库 reflect-metadata
和 class-transformer
,参考如下 demo 实现:
//TestJson.ets
import { plainToClass, Type } from 'class-transformer';
import 'reflect-metadata';
import { Person, ViewA } from './ViewA';
class ResponseObj {
@Type(() => Person)
data: Person[] = [];
}
@Entry
@Component
struct TestJson {
@State list: Person[] = [];
@State message: string = 'Click me';
aboutToAppear(): void {
let str = '{"data" : [{"number" :1,"age": 20, "testA": { "str" : "123"}},{"number" :2,"age": 21,"testA": {"str" : "456"}}]}'
let jsonData: ESObject = JSON.parse(str)
let responseObj: ResponseObj = plainToClass(ResponseObj, jsonData);
console.log(` ${responseObj.data[0] instanceof Person}`)
this.list = this.list.concat(responseObj.data);
}
build() {
Row() {
Column() {
ForEach(this.list, (item: Person, index: number) => {
ViewA({ index: index, test item.testA })
})
}
.width('100%')
}
.height('100%')
}
}
//ViewA.ets
import { Type } from 'class-transformer'
@Observed
export class TestA {
public str : string
constructor(str: string) {
this.str = str;
}
}
export class Person {
name: string = ''
age: number = 1
@Type(() => TestA)
test
TestA = new TestA('')
}
@Component
export struct ViewA {
@ObjectLink test
TestA
index: number = -1;
build() {
Row(){
Button(`View A ${this.testA.str}`).onClick(() =>{
this.index += 1;
this.testA.str = `${this.index} : Test A String`
})
}.margin({top : 10 })
}
}
使用 ohpm 引入三方库
ohpm install class-transformer
ohpm install reflect-metadata
更多关于HarmonyOS 鸿蒙Next 二维数组更新删除二维数组下item 没有刷新怎么解决?的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
因为v1的状态管理深度监听有问题 可以参考v2状态管理进行修改
在HarmonyOS鸿蒙系统中,当你遇到二维数组更新或删除元素后界面没有刷新的问题,这通常与数据绑定和UI刷新机制有关。以下是可能的原因及解决方法:
-
数据绑定未正确设置:确保你的二维数组与UI组件正确绑定。如果使用数据模型(如MVVM),检查模型是否已通知UI进行更新。
-
UI组件未触发刷新:在更新二维数组后,需要显式地通知UI组件进行刷新。这可能涉及调用特定的刷新方法或触发相关的事件。
-
数组操作未触发监听:如果你使用的是自定义的数组或数据结构,确保在数组元素被更新或删除时,有相应的机制来触发UI的刷新。
-
使用列表组件的注意事项:如果使用的是列表组件(如ListContainer),确保在更新数组后调用列表的刷新方法,如
refresh()
或类似的方法。 -
线程问题:确保UI更新操作在主线程中进行。如果数据更新在后台线程中完成,需要使用适当的线程切换机制来更新UI。
如果问题依旧没法解决请联系官网客服,官网地址是 https://www.itying.com/category-93-b0.html 。