HarmonyOS 鸿蒙Next 被@ObservedV2和@Trace标记的类及字段 使用JSON.stringify后字段名称都加上了“__ob_”开头的字段

发布于 1周前 作者 vueper 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 被@ObservedV2@Trace标记的类及字段 使用JSON.stringify后字段名称都加上了“_ob”开头的字段

如下类:

@ObservedV2
export class SelfDateTimeGroupModel {
public static readonly DATE_TIME_SEPARATE = " ";
@Trace private beginDate: string = “”;
@Trace private beginTime: string = “”;
@Trace private endDate: string = “”;
@Trace private endTime: string = “”;
@Trace private formatBeginDate: string = “”;
@Trace private formatBeginTime: string = “”;
@Trace private formatEndDate: string = “”;
@Trace private formatEndTime: string = “”;
}

使用JSON.stringify序列化之后字段名称都改变了,导致无法反序列化回来:

“dateTimeGroup”: {
“__ob_beginDate”: “2024-06-05”,
“__ob_beginTime”: “17:00”,
“__ob_endDate”: “2024-06-07”,
“__ob_endTime”: “17:00”,
“__ob_formatBeginDate”: “06月05日”,
“__ob_formatBeginTime”: “周三 17:00”,
“__ob_formatEndDate”: “06月07日”,
“__ob_formatEndTime”: “周五 17:00”
}


更多关于HarmonyOS 鸿蒙Next 被@ObservedV2和@Trace标记的类及字段 使用JSON.stringify后字段名称都加上了“__ob_”开头的字段的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复
关于序列化后会有__ob_前缀的问题,可以在序列前替换掉__ob_前缀,demo如下
import { plainToClass } from "class-transformer";
[@ObservedV2](/user/ObservedV2)
class Son {
[@Trace](/user/Trace) age: number = 100;
}
class Father {
son: Son = new Son();
}
[@Entry](/user/Entry)
[@Component](/user/Component)
struct Index {
father: Father = new Father();
aboutToAppear(): void {
let a = JSON.stringify(this.father);
let b: Father = plainToClass(Father,this.father);
//{"son":{"__ob_age":100}}替换成{"son":{"age":100}}
console.log(JSON.stringify(convertKeysToCamelCase(this.father)))
}

build() {
Column() {
// 当点击改变age时,Text组件会刷新
Text(`${this.father.son.age}`)
.onClick(() => {
this.father.son.age++;
})
}
}
}

// utils.ets
export function underscoreToCamelCase(underscoreString:string):string {
// 捕获__ob_替换成''
return underscoreString.replace(/(__ob_)/g, (match:string, letter:string):string=> {
console.log(letter)
return '';
});
}
export function convertKeysToCamelCase(obj:ESObject):ESObject {
if (obj && typeof obj === 'object') {
const newObj:ESObject = {};
Object.keys(obj).forEach((key)=> {
if (obj.hasOwnProperty(key)) {
const newKey = underscoreToCamelCase(key);
newObj[newKey] = convertKeysToCamelCase(obj[key]);
}
})
return newObj;
} else {
return obj;
}
}

更多关于HarmonyOS 鸿蒙Next 被@ObservedV2和@Trace标记的类及字段 使用JSON.stringify后字段名称都加上了“__ob_”开头的字段的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中,当你使用@ObservedV2@Trace标记类及字段,并通过JSON.stringify对这些对象进行序列化时,字段名称前出现"__ob_"前缀的问题通常是由于这些标记触发了框架内部的响应式系统或追踪机制。

@ObservedV2标记的字段通常用于实现响应式数据绑定,框架会在这些字段上附加观察者对象以追踪数据变化。类似地,@Trace标记可能用于性能追踪,也会在对象上附加追踪信息。

在序列化过程中,JSON.stringify会遍历对象的所有可枚举属性,包括这些由框架动态添加的属性。因此,你会在序列化结果中看到以"__ob_"开头的字段。

要解决这个问题,你可以考虑以下几种方法(但根据你的要求,这里不给出具体建议):

  • 自定义序列化:实现一个自定义的序列化方法,只包含你希望序列化的字段。
  • 使用代理:通过Proxy对象控制对原始对象的访问,以过滤掉不希望被序列化的属性。
  • 数据转换:在序列化之前,将对象转换为纯数据对象,不包含任何框架附加的属性。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部