Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
fdd212e8
D
Docs
项目概览
OpenHarmony
/
Docs
1 年多 前同步成功
通知
159
Star
292
Fork
28
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
Docs
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
未验证
提交
fdd212e8
编写于
1年前
作者:
1
189******51
提交者:
Gitee
1年前
浏览文件
操作
浏览文件
下载
差异文件
!2 update zh-cn/application-dev/quick-start/arkts-state-management-best-practices.md.
Merge pull request !2 from 耿文广/N/A
上级
7c14a06c
b7b502c3
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
115 addition
and
28 deletion
+115
-28
zh-cn/application-dev/quick-start/arkts-state-management-best-practices.md
...-dev/quick-start/arkts-state-management-best-practices.md
+115
-28
未找到文件。
zh-cn/application-dev/quick-start/arkts-state-management-best-practices.md
浏览文件 @
fdd212e8
...
...
@@ -41,7 +41,7 @@ struct LinkChild {
@
Component
struct
PropChild2
{
@
Prop
testNum
:
ClassA
;
@
Prop
testNum
:
ClassA
=
new
ClassA
(
0
)
;
build
()
{
Text
(
`PropChild2 testNum
${
this
.
testNum
.
c
}
`
)
...
...
@@ -53,7 +53,7 @@ struct PropChild2 {
@
Component
struct
PropChild3
{
@
Prop
testNum
:
ClassA
;
@
Prop
testNum
:
ClassA
=
new
ClassA
(
0
)
;
build
()
{
Text
(
`PropChild3 testNum
${
this
.
testNum
.
c
}
`
)
...
...
@@ -460,10 +460,10 @@ struct ParentComp {
CounterComp
({
value
:
this
.
counter
[
2
]
})
Divider
().
height
(
5
)
ForEach
(
this
.
counter
,
item
=>
{
(
item
:
ParentCounter
)
=>
{
CounterComp
({
value
:
item
})
},
item
=>
item
.
id
.
toString
()
(
item
:
ParentCounter
)
=>
item
.
id
.
toString
()
)
Divider
().
height
(
5
)
// 第一个点击事件
...
...
@@ -576,10 +576,10 @@ struct ParentComp {
CounterComp
({
value
:
this
.
counter
[
2
],
subValue
:
this
.
counter
[
2
].
subCounter
})
Divider
().
height
(
5
)
ForEach
(
this
.
counter
,
item
=>
{
(
item
:
ParentCounter
)
=>
{
CounterComp
({
value
:
item
,
subValue
:
item
.
subCounter
})
},
item
=>
item
.
id
.
toString
()
(
item
:
ParentCounter
)
=>
item
.
id
.
toString
()
)
Divider
().
height
(
5
)
Text
(
'
Parent: reset entire counter
'
)
...
...
@@ -673,10 +673,10 @@ struct ParentComp {
CounterComp
({
value
:
this
.
counter
[
2
],
subValue
:
this
.
counter
[
2
].
subCounter
})
Divider
().
height
(
5
)
ForEach
(
this
.
counter
,
item
=>
{
(
item
:
ParentCounter
)
=>
{
CounterComp
({
value
:
item
,
subValue
:
item
.
subCounter
})
},
item
=>
item
.
id
.
toString
()
(
item
:
ParentCounter
)
=>
item
.
id
.
toString
()
)
Divider
().
height
(
5
)
Text
(
'
Parent: reset entire counter
'
)
...
...
@@ -754,6 +754,37 @@ struct CounterComp {
```
ts
let
nextId
=
1
;
@
Observed
class
SubCounter
{
counter
:
number
;
constructor
(
c
:
number
)
{
this
.
counter
=
c
;
}
}
@
Observed
class
ParentCounter
{
id
:
number
;
counter
:
number
;
subCounter
:
SubCounter
;
incrCounter
()
{
this
.
counter
++
;
}
incrSubCounter
(
c
:
number
)
{
this
.
subCounter
.
counter
+=
c
;
}
setSubCounter
(
c
:
number
):
void
{
this
.
subCounter
.
counter
=
c
;
}
constructor
(
c
:
number
)
{
this
.
id
=
nextId
++
;
this
.
counter
=
c
;
this
.
subCounter
=
new
SubCounter
(
c
);
}
}
@
Component
struct
SubCounterComp
{
@
ObjectLink
subValue
:
SubCounter
;
...
...
@@ -767,7 +798,7 @@ struct SubCounterComp {
}
@
Component
struct
CounterComp
{
@
Prop
value
:
ParentCounter
;
@
ObjectLink
value
:
ParentCounter
;
build
()
{
Column
({
space
:
10
})
{
Text
(
`this.value.incrCounter(): this.value.counter:
${
this
.
value
.
counter
}
`
)
...
...
@@ -798,10 +829,10 @@ struct ParentComp {
CounterComp
({
value
:
this
.
counter
[
2
]
})
Divider
().
height
(
5
)
ForEach
(
this
.
counter
,
item
=>
{
(
item
:
ParentCounter
)
=>
{
CounterComp
({
value
:
item
})
},
item
=>
item
.
id
.
toString
()
(
item
:
ParentCounter
)
=>
item
.
id
.
toString
()
)
Divider
().
height
(
5
)
Text
(
'
Parent: reset entire counter
'
)
...
...
@@ -949,15 +980,18 @@ struct CompA {
realState1
:
Array
<
number
>
=
[
4
,
1
,
3
,
2
];
// 未使用状态变量装饰器
realState2
:
Color
=
Color
.
Yellow
;
updateUI
(
param
:
any
):
any
{
updateUI1
(
param
:
Array
<
number
>
):
Array
<
number
>
{
const
triggerAGet
=
this
.
needsUpdate
;
return
param
;
}
updateUI2
(
param
:
Color
):
Color
{
const
triggerAGet
=
this
.
needsUpdate
;
return
param
;
}
build
()
{
Column
({
space
:
20
})
{
ForEach
(
this
.
updateUI
(
this
.
realState1
),
item
=>
{
ForEach
(
this
.
updateUI
1
(
this
.
realState1
),
(
item
:
Array
<
number
>
)
=>
{
Text
(
`
${
item
}
`
)
})
Text
(
"
add item
"
)
...
...
@@ -976,7 +1010,7 @@ struct CompA {
// 触发UI视图更新
this
.
needsUpdate
=
!
this
.
needsUpdate
;
})
}.
backgroundColor
(
this
.
updateUI
(
this
.
realState2
))
}.
backgroundColor
(
this
.
updateUI
2
(
this
.
realState2
))
.
width
(
200
).
height
(
500
)
}
}
...
...
@@ -1005,7 +1039,7 @@ struct CompA {
build
()
{
Column
({
space
:
20
})
{
ForEach
(
this
.
realState1
,
item
=>
{
(
item
:
Array
<
number
>
)
=>
{
Text
(
`
${
item
}
`
)
})
Text
(
"
add item
"
)
...
...
@@ -1108,7 +1142,7 @@ struct Parent {
@
Component
struct
Child
{
@
Prop
voteOne
:
ClassE
@
ObjectLink
voteOne
:
ClassE
build
()
{
Column
()
{
Text
(
this
.
voteOne
.
name
).
fontSize
(
24
).
fontColor
(
Color
.
Red
).
margin
(
50
)
...
...
@@ -1123,7 +1157,7 @@ struct Child {
@
Component
struct
ChildOne
{
@
Prop
voteTwo
:
ClassD
@
ObjectLink
voteTwo
:
ClassD
build
()
{
Column
()
{
Text
(
this
.
voteTwo
.
name
).
fontSize
(
24
).
fontColor
(
Color
.
Red
).
margin
(
50
)
...
...
@@ -1138,7 +1172,7 @@ struct ChildOne {
@
Component
struct
ChildTwo
{
@
Prop
voteThree
:
ClassC
@
ObjectLink
voteThree
:
ClassC
build
()
{
Column
()
{
Text
(
this
.
voteThree
.
name
).
fontSize
(
24
).
fontColor
(
Color
.
Red
).
margin
(
50
)
...
...
@@ -1153,7 +1187,7 @@ struct ChildTwo {
@
Component
struct
ChildThree
{
@
Prop
voteFour
:
ClassB
@
ObjectLink
voteFour
:
ClassB
build
()
{
Column
()
{
Text
(
this
.
voteFour
.
name
).
fontSize
(
24
).
fontColor
(
Color
.
Red
).
margin
(
50
)
...
...
@@ -1168,7 +1202,7 @@ struct ChildThree {
@
Component
struct
ChildFour
{
@
Prop
voteFive
:
ClassA
@
ObjectLink
voteFive
:
ClassA
build
()
{
Column
()
{
Text
(
this
.
voteFive
.
title
).
fontSize
(
24
).
fontColor
(
Color
.
Red
).
margin
(
50
)
...
...
@@ -1245,6 +1279,59 @@ class ClassE {
以下组件层次结构呈现的是@Reusable组件复用场景的数据结构。
```
ts
// 以下是嵌套类对象的数据结构。
@
Observed
class
ClassA
{
public
title
:
string
;
constructor
(
title
:
string
)
{
this
.
title
=
title
;
}
}
@
Observed
class
ClassB
{
public
name
:
string
;
public
a
:
ClassA
;
constructor
(
name
:
string
,
a
:
ClassA
)
{
this
.
name
=
name
;
this
.
a
=
a
;
}
}
@
Observed
class
ClassC
{
public
name
:
string
;
public
b
:
ClassB
;
constructor
(
name
:
string
,
b
:
ClassB
)
{
this
.
name
=
name
;
this
.
b
=
b
;
}
}
@
Observed
class
ClassD
{
public
name
:
string
;
public
c
:
ClassC
;
constructor
(
name
:
string
,
c
:
ClassC
)
{
this
.
name
=
name
;
this
.
c
=
c
;
}
}
@
Observed
class
ClassE
{
public
name
:
string
;
public
d
:
ClassD
;
constructor
(
name
:
string
,
d
:
ClassD
)
{
this
.
name
=
name
;
this
.
d
=
d
;
}
}
@
Entry
@
Component
struct
Parent
{
...
...
@@ -1266,9 +1353,9 @@ struct Parent {
@
Component
struct
Child
{
@
State
voteOne
:
ClassE
=
new
ClassE
(
'
voteOne
'
,
new
ClassD
(
'
OpenHarmony
'
,
new
ClassC
(
'
Hello
'
,
new
ClassB
(
'
World
'
,
new
ClassA
(
'
Peace
'
)))))
aboutToReuse
(
params
){
this
.
voteOne
=
params
aboutToReuse
(
params
:
ClassE
)
{
this
.
voteOne
=
params
}
build
()
{
Column
()
{
...
...
@@ -1287,7 +1374,7 @@ struct Child {
@
Component
struct
ChildOne
{
@
State
voteTwo
:
ClassD
=
new
ClassD
(
'
voteTwo
'
,
new
ClassC
(
'
Hello
'
,
new
ClassB
(
'
World
'
,
new
ClassA
(
'
Peace
'
))))
aboutToReuse
(
params
){
aboutToReuse
(
params
:
ClassD
){
this
.
voteTwo
=
params
}
build
()
{
...
...
@@ -1307,7 +1394,7 @@ struct ChildOne {
@
Component
struct
ChildTwo
{
@
State
voteThree
:
ClassC
=
new
ClassC
(
'
voteThree
'
,
new
ClassB
(
'
World
'
,
new
ClassA
(
'
Peace
'
)))
aboutToReuse
(
params
){
aboutToReuse
(
params
:
ClassC
){
this
.
voteThree
=
params
}
...
...
@@ -1328,7 +1415,7 @@ struct ChildTwo {
@
Component
struct
ChildThree
{
@
State
voteFour
:
ClassB
=
new
ClassB
(
'
voteFour
'
,
new
ClassA
(
'
Peace
'
))
aboutToReuse
(
params
){
aboutToReuse
(
params
:
ClassB
){
this
.
voteFour
=
params
}
...
...
@@ -1349,7 +1436,7 @@ struct ChildThree {
@
Component
struct
ChildFour
{
@
State
voteFive
:
ClassA
=
new
ClassA
(
'
voteFive
'
)
aboutToReuse
(
params
){
aboutToReuse
(
params
:
ClassA
){
this
.
voteFive
=
params
}
...
...
This diff is collapsed.
Click to expand it.
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录
新手
引导
客服
返回
顶部