• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1import {
2  Text,
3  Column,
4  Component,
5  Entry,
6  Button,
7  ClickEvent ,
8  NavDestination,
9  NavPathStack,
10  NavDestinationContext,
11  Callback
12} from '@ohos.arkui.component'
13
14import {
15  State,
16  Link,
17  Prop,
18  StorageLink,
19  StorageProp,
20  AppStorage,
21  LocalStorage
22} from '@ohos.arkui.stateManagement'
23
24import hilog from '@ohos.hilog'
25
26@Entry
27@Component
28export struct StateLinkPropTest {
29  @State stateVar: string = 'state var';
30  message: string = `click to change state variable, add **`;
31  changeValue() {
32    this.stateVar+='**'
33  }
34
35  build() {
36    NavDestination() {
37      Column(undefined) {
38        Button('clean variable').onClick((e: ClickEvent) => {
39          this.stateVar = 'state var'
40        })
41        Text('Hello World').fontSize(20)
42        Button(this.message).backgroundColor('#FFFF00FF')
43          .onClick((e: ClickEvent) => {
44            hilog.info(0x0000, 'testTag', 'On Click');
45            this.changeValue()
46          })
47        Text(this.stateVar).fontSize(20)
48        Child({ linkVar: this.stateVar, propVar: this.stateVar })
49      }.margin(10)
50    }
51    .title('State/Prop/Link支持基础功能测试')
52  }
53}
54
55@Component
56struct Child {
57  @Link linkVar: string = '';
58  @Prop propVar: string = 'Prop';
59
60  changeValue1() {
61    this.linkVar+='!!'
62  }
63
64  changeValue2() {
65    this.propVar+='~~'
66  }
67
68  build() {
69    Column(undefined) {
70      Button(`click to change Link variable, add symbol !!`)
71        .backgroundColor('#4169E1')
72        .onClick((e: ClickEvent) => {
73          hilog.info(0x0000, 'testTag', 'On Click');
74          this.changeValue1()
75        })
76      Button(`click to change Prop variable, add symbol ~~`)
77        .backgroundColor('#3CB371')
78        .onClick((e: ClickEvent) => {
79          hilog.info(0x0000, 'testTag', 'On Click');
80          this.changeValue2()
81        })
82      Text(`Link variable in child: ${this.linkVar}`).fontSize(30)
83      Text(`Prop variable in child: ${this.propVar}`).fontSize(30)
84    }
85  }
86}
87