1# Counter
2
3计数器组件，提供相应的增加或者减少的计数操作。
4
5>  **说明：**
6>
7> 该组件从API Version 7开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
8
9
10## 子组件
11
12可以包含子组件。
13
14
15## 接口
16
17Counter()
18
19**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。
20
21**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
22
23**系统能力：** SystemCapability.ArkUI.ArkUI.Full
24
25## 属性
26
27除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性。 
28
29### enableInc<sup>10+</sup>
30
31enableInc(value: boolean)
32
33设置增加按钮禁用或使能。
34
35**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
36
37**系统能力：** SystemCapability.ArkUI.ArkUI.Full
38
39**参数：** 
40
41| 参数名 | 类型    | 必填 | 说明                                  |
42| ------ | ------- | ---- | ------------------------------------- |
43| value  | boolean | 是   | 增加按钮禁用或使能。<br/>默认值：true |
44
45### enableDec<sup>10+</sup>
46
47enableDec(value: boolean)
48
49设置减少按钮禁用或使能。
50
51**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
52
53**系统能力：** SystemCapability.ArkUI.ArkUI.Full
54
55**参数：** 
56
57| 参数名 | 类型    | 必填 | 说明                                  |
58| ------ | ------- | ---- | ------------------------------------- |
59| value  | boolean | 是   | 减少按钮禁用或使能。<br/>默认值：true |
60
61## 事件
62
63除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件：
64
65### onInc
66
67onInc(event:&nbsp;VoidCallback)
68
69监听数值增加事件。
70
71**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。
72
73**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
74
75**系统能力：** SystemCapability.ArkUI.ArkUI.Full
76
77**参数：** 
78
79| 参数名 | 类型                                           | 必填 | 说明                                 |
80| ------ | --------------------------------------------- | ---- | ----------------------------------- |
81| event  | [VoidCallback](ts-types.md#voidcallback12)    | 是   | Counter数值增加的回调函数。        |
82
83### onDec
84
85onDec(event:&nbsp;VoidCallback)
86
87监听数值减少事件。
88
89**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。
90
91**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。
92
93**系统能力：** SystemCapability.ArkUI.ArkUI.Full
94
95**参数：** 
96
97| 参数名 | 类型                                           | 必填 | 说明                                 |
98| ------ | --------------------------------------------- | ---- | ----------------------------------- |
99| event  | [VoidCallback](ts-types.md#voidcallback12)    | 是   | Counter数值减少的回调函数。        |
100
101
102## 示例
103
104```ts
105// xxx.ets
106@Entry
107@Component
108struct CounterExample {
109  @State value: number = 0
110
111  build() {
112    Column() {
113      Counter() {
114        Text(this.value.toString())
115      }.margin(100)
116      .onInc(() => {
117        this.value++
118      })
119      .onDec(() => {
120        this.value--
121      })
122    }.width("100%")
123  }
124}
125```
126
127![zh-cn_image_0000001219982711](figures/zh-cn_image_0000001219982711.gif)
128