• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# $语法：内置组件双向同步
2
3
4$$运算符为系统内置组件提供TS变量的引用，使得TS变量和系统内置组件的内部状态保持同步。
5
6
7内部状态具体指什么取决于组件。例如，[bindPopup](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md)属性方法的show参数。
8
9
10## 使用规则
11
12- 当前$$支持基础类型变量，以及\@State、\@Link和\@Prop装饰的变量。
13
14- 当前$$仅支持[bindPopup](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md)属性方法的show参数，[Radio](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md)组件的checked属性，[Refresh](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md)组件的refreshing参数。
15
16- $$绑定的变量变化时，会触发UI的同步刷新。
17
18
19## 使用示例
20
21以[bindPopup](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md)属性方法的show参数为例：
22
23
24```ts
25// xxx.ets
26@Entry
27@Component
28struct bindPopupPage {
29  @State customPopup: boolean = false;
30
31  build() {
32    Column() {
33      Button('Popup')
34        .margin(20)
35        .onClick(() => {
36          this.customPopup = !this.customPopup
37        })
38        .bindPopup($$this.customPopup, {
39          message: 'showPopup'
40        })
41    }
42  }
43}
44```
45
46
47![popup](figures/popup.gif)
48