其乐融融的IT技术小站

若干种在日常开发中会导致@Observed失效的情况

想了解更多关于开源的内容,请访问:

51CTO 开源基础软件社区

https://ost.51cto.com

概述

@Observed与@ObjectLink是开发中常用的复杂数据类型绑定的技巧。
但是@Observed与@ObjectLink在开发中存在着许多坑。
接下来我将列举我遇到的几个坑。

测试环境

测试工具:DevEco Studio 3.1.1 Release
测试API版本号:API9
测试环境:

  • OpenHarmony 3.2 Release
  • HarmonyOS API9 模拟器

正确使用场景

首先我将举例正确在开发中@Observed与@ObjectLink的正确使用方式,并且正确文件的源文件我也会打包放置在资源文件中。

先来看实现效果:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

源代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

DataModel.ets:

// 接口
@Observed
export class  DataInteface {
  value: number;
}
// 实现数据类
@Observed
export class DataModel implements DataInteface {
  value: number = 0;
}

Index.ets:

import { DataModel, DataInteface } from "../model/DataModel"

@Entry
@Component
struct Index {
  @State
  sensors: DataInteface[] = [
    new DataModel(),
    new DataModel(),
    new DataModel(),
    new DataModel(),
    new DataModel(),
    new DataModel(),
  ];

  build() {
    Row() {
      List() {
        ForEach(this.sensors, (item: DataInteface) => {
          ListItem() {
            SensorView({ sen: item })
          }.width("100%")
        })
      }
      .width("100%")
    }
  }
}

@Component
struct SensorView {
  @ObjectLink
  sen: DataInteface
  build() {
    Button(`点击数据会自增${this.sen.value}`)
      .fontSize(20)
      .backgroundColor(Color.Yellow)
      .onClick(() => {
        this.sen.value++;
        console.log("anran" + this.sen.value)
      })
  }
}

错误使用方法

1、使用interface撰写接口

虽然按照TypeScript规范需要使用interface撰写接口,但是@Observed不能修饰interface。所以在OpenHarmony开发中应当使用class撰写接口。
效果:可以进行数据双向绑定,但是编译时会报错。

错误代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

// 接口
@Observed
export interface  DataInteface {
  value: number;
}
// 实现类
@Observed
export class DataModel implements DataInteface {
  value: number = 0;
}

2、使用链式编程初始化数据

在OpenHarmony中不应当使用链式编程初始化@Observed修饰的对象。因为这将会替代掉@Observed帮助我们生产的对象转而使用原生的数据对象。这将会导致所有的数据无法进行双向绑定。
在实际项目中很容易因为一贯的编程经验而使用链式编程,这时候就会出现问题,而且这种问题很难排查,小编就遇到了这种问题。

效果:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

3、直接使用for循环对@Observed对象渲染

直接使用for循环对@Observed对象渲染渲染,而不封装,不使用@ObjectLink对数据引用。

运行效果:同错误2。

代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

4、只给接口使用了@Observed没有给实现类写@Observed

运行效果:同错误2

代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

5、没有给接口使用@Observed,只给实现类写@Observed

效果:程序可以正常双向绑定,但是编译器会给出警告。

代码:

若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区若干种在日常开发中会导致@Observed失效的情况-开源基础软件社区

结论

@Observed 可能是通过某种替代原有对象的方式实现的,所以使用链式编程初始化对象会导致数据双向绑定失效。
而通常来说编译器的警告都是自己编译器给的,很可能不会正常影响程序运行。

@ObjectLink 与 @Observed 能够极大的提高开发效率,但是也存在很多坑。特别是无法使用链式编程这种问题,会让很多从其他开发方向转OpenHarmony的老鸟都掉坑里。所以必须认真对待@ObjectLink 与 @Observed。

文章相关附件可以点击下面的原文链接前往下载

https://ost.51cto.com/resource/2931

想了解更多关于开源的内容,请访问:

51CTO 开源基础软件社区

https://ost.51cto.com

赞 ()
分享到:更多 ()

相关推荐

内容页底部广告位3
留言与评论(共有 0 条评论)
   
验证码: