OpenHarmony ETS AppStorage 图文示例用法 原创 精华

陈浩南xxx
发布于 2022-4-22 13:59
浏览
3收藏

OpenHarmony ETS AppStorage 图文示例用法

应用开发过程中可能需要全局一个变量,然后变化了也能及时收到通知;这个时候可以考虑使用AppStorage

  • AppStorage

    • AppStorage是应用程序中的单例对象,为可变应用程序状态属性提供中央存储, ==类似extern,使状态变量跨文件使用,生命周期:整个进程==
    • 默认情况下,AppStorage中的属性是可变的,AppStorage还可使用不可变(只读)属性
    • 当前接口当前仅可以处理基础类型数据,对于修改object中某一个值尚未支持

1,用法示例

需要的地方 定义一个成员变量用@StorageLink,括号里面是它的key

@StorageLink('key_string') keyString: string = ""

在需要控制它的地方得到这个Link对象

var mStringLink;
mStringLink = AppStorage.SetAndLink("key_string", "s");

改变它的值是

mStringLink.set('改变的值')

2,效果演示

OpenHarmony ETS  AppStorage 图文示例用法-鸿蒙开发者社区OpenHarmony ETS  AppStorage 图文示例用法-鸿蒙开发者社区

3,更多特性

方法 参数说明 返回值 定义
Link key: string @Link 如果存在具有给定键的数据,则返回到此属性的双向数据绑定,该双向绑定意味着变量或者组件对数据的更改将同步到AppStorage,通过AppStorage对数据的修改将同步到变量或者组件。如果具有此键的属性不存在或属性为只读,则返回undefined
SetAndLink key : StringdefaultValue: T @Link 与Link接口类似。如果当前的key在AppStorage有保存,则返回此key对应的value。如果此key未被创建,则创建一个对应default值的Link返回。
Prop key: string @Prop 如果存在具有给定键的属性,则返回到此属性的单向数据绑定。该单向绑定意味着只能通过AppStorage将属性的更改同步到变量或者组件。该方法返回的变量为不可变变量,适用于可变和不可变的状态属性,如果具有此键的属性不存在则返回undefined。说明prop方法对应的属性值类型为简单类型。
SetAndProp key : stringdefaultValue: S @Prop 与Prop接口类似。如果当前的key在AppStorage有保存,则返回此key对应的value。如果此key未被创建,则创建一个对应default值的Prop返回。
Has key: string boolean 判断对应键值的属性是否存在。
Keys void array<string> 返回包含所有键的字符串数组。
Get string T或undefined 通过此接口获取对应此key值的value
Set string, newValue :T void 对已保存的key值,替换其value值。
SetOrCreate string, newValue :T boolean 如果相同名字的属性存在:如果此属性可以被更改返回true,否则返回false如果相同名字的属性不存在:创建第一个赋值为defaultValue的属性,不支持null和undefined
Delete key : string boolean 删除属性,如果存在返回true,不存在返回false
Clear none boolean 删除所有的属性,如果当前有状态变量依旧引用此属性,则返回false
IsMutable key: string 返回此属性是否存在并且是否可以改变。

4,示例代码

import router from '@ohos.router';
import mTestModel from '../TestModel';

@Entry
@Component
struct Index {
  @State message: string = '我是首界面'
  @StorageLink('key_string') keyString: string = ""
  @StorageLink('key_number') keyNumber: number = 0
  @StorageLink('key_boolean') keyBoolean: boolean = false
  private name = "q"



  aboutToAppear() {
    console.log("aboutToAppear...")
    mTestModel.initModel();
  }

  build() {
    Column() {

      Button(`打印日志`).fontSize(24).onClick(() => {
        console.log("我是日志");
      }).margin({ top: 20 })

      Text(this.message)
        .fontSize(30)
        .margin({ top: 20 })
        .fontWeight(FontWeight.Bold)

      Text(this.updateKeyString(this.keyString))
        .fontSize(24)
        .textAlign(TextAlign.Center)

      Text(`${this.keyNumber}`)
        .fontSize(24)
        .textAlign(TextAlign.Center)


      Text(`${this.keyBoolean}`)
        .fontSize(24)
        .textAlign(TextAlign.Center)

      Button(`setLinkString`).fontSize(24).onClick(() => {
        mTestModel.setLinkString()
      }).margin({ top: 20 })

      Button(`add`).fontSize(24).onClick(() => {
        mTestModel.add()
      }).margin({ top: 20 })

      Button(`setLinkBoolean`).fontSize(24).onClick(() => {
        mTestModel.setLinkBoolean()
      }).margin({ top: 20 })

      Button(`go second`).fontSize(24).onClick(() => {
        router.push({ url: 'pages/second' })
      }).margin({ top: 20 })

    }.width('100%')
  }

  private updateKeyString(keyString) {
    console.log("updateKeyString..." + keyString)
    let s = this.name + keyString
    return s;
  }
}
import router from '@ohos.router';
import mTestModel from '../TestModel';

@Entry
@Component
struct Second {
  @State message: string = '我是第二个界面'
  @StorageLink('key_string') keyString: string = ""
  @StorageLink('key_number') keyNumber: number = 0
  @StorageLink('key_boolean') keyBoolean: boolean = false
  private name = "z"

  aboutToAppear() {
    console.log("aboutToAppear...")
    mTestModel.initModel();
  }

  build() {
    Column() {
      Text(this.message)
        .fontSize(30)
        .margin({ top: 20 })
        .fontWeight(FontWeight.Bold)

      Text(this.keyString)
        .fontSize(24)
        .textAlign(TextAlign.Center)

      Text(`${this.keyNumber}`)
        .fontSize(24)
        .textAlign(TextAlign.Center)


      Text(`${this.keyBoolean}`)
        .fontSize(24)
        .textAlign(TextAlign.Center)

      Button(`setLinkString`).fontSize(24).onClick(() => {
        mTestModel.setLinkString()
      }).margin({ top: 20 })

      Button(`add`).fontSize(24).onClick(() => {
        mTestModel.add()
      }).margin({ top: 20 })

      Button(`setLinkBoolean`).fontSize(24).onClick(() => {
        mTestModel.setLinkBoolean()
      }).margin({ top: 20 })


      Button(`back`).fontSize(24).onClick(() => {
        router.back()
      }).margin({ top: 20 })
    }.width('100%')
  }
}
var mStringLink;
var mNumberLink;
var mBooleanLink;

export class TestModel {
    initModel() {
        console.log("initModel...")
        mStringLink = AppStorage.SetAndLink("key_string", "s");
        mNumberLink = AppStorage.SetAndLink("key_number", 0);
        mBooleanLink = AppStorage.SetAndLink("key_boolean", false);
    }

    setLinkString() {
        let temp = mStringLink.get()
        console.log("mNumberLink:" + temp)
        mStringLink.set(temp + 's')
    }

    setLinkBoolean() {
        let temp = mBooleanLink.get()
        console.log("mBooleanLink:" + temp)
        mBooleanLink.set(!temp)
    }

    add() {
        let temp = mNumberLink.get()
        console.log("mNumberLink:" + temp)
        mNumberLink.set(++temp)
    }
}


let mTestModel = new TestModel();

export default mTestModel as TestModel;

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
3
收藏 3
回复
举报
1条回复
按时间正序
/
按时间倒序
红叶亦知秋
红叶亦知秋

赞,感谢分享。

回复
2022-4-22 16:00:42
回复
    相关推荐