1# $$语法:内置组件双向同步 2 3 4$$运算符为系统内置组件提供TS变量的引用,使得TS变量和系统内置组件的内部状态保持同步。 5 6 7内部状态具体指什么取决于组件。例如,[TextInput](../reference/arkui-ts/ts-basic-components-textinput.md)组件的text参数。 8 9 10> **说明:** 11> 12> $$还用于[@Builder装饰器的按引用传递参数](arkts-builder.md#按引用传递参数),开发者需要注意两种用法的区别。 13 14 15## 使用规则 16 17- 当前$$支持基础类型变量,以及\@State、\@Link和\@Prop装饰的变量。 18 19- 当前$$支持的组件 20 21 | 组件 | 支持的参数/属性 | 起始API版本 | 22 | ------------------------------------------------------------ | --------------- | ----------- | 23 | [Checkbox](../reference/arkui-ts/ts-basic-components-checkbox.md) | select | 10 | 24 | [CheckboxGroup](../reference/arkui-ts/ts-basic-components-checkboxgroup.md) | selectAll | 10 | 25 | [DatePicker](../reference/arkui-ts/ts-basic-components-datepicker.md) | selected | 10 | 26 | [TimePicker](../reference/arkui-ts/ts-basic-components-timepicker.md) | selected | 10 | 27 | [MenuItem](../reference/arkui-ts/ts-basic-components-menuitem.md) | selected | 10 | 28 | [Panel](../reference/arkui-ts/ts-container-panel.md) | mode | 10 | 29 | [Radio](../reference/arkui-ts/ts-basic-components-radio.md) | checked | 10 | 30 | [Rating](../reference/arkui-ts/ts-basic-components-rating.md) | rating | 10 | 31 | [Search](../reference/arkui-ts/ts-basic-components-search.md) | value | 10 | 32 | [SideBarContainer](../reference/arkui-ts/ts-container-sidebarcontainer.md) | showSideBar | 10 | 33 | [Slider](../reference/arkui-ts/ts-basic-components-slider.md) | value | 10 | 34 | [Stepper](../reference/arkui-ts/ts-basic-components-stepper.md) | index | 10 | 35 | [Swiper](../reference/arkui-ts/ts-container-swiper.md) | index | 10 | 36 | [Tabs](../reference/arkui-ts/ts-container-tabs.md) | index | 10 | 37 | [TextArea](../reference/arkui-ts/ts-basic-components-textarea.md) | text | 10 | 38 | [TextInput](../reference/arkui-ts/ts-basic-components-textinput.md) | text | 10 | 39 | [TextPicker](../reference/arkui-ts/ts-basic-components-textpicker.md) | selected、value | 10 | 40 | [Toggle](../reference/arkui-ts/ts-basic-components-toggle.md) | isOn | 10 | 41 | [AlphabetIndexer](../reference/arkui-ts/ts-container-alphabet-indexer.md) | selected | 10 | 42 | [Select](../reference/arkui-ts/ts-basic-components-select.md) | selected、value | 10 | 43 | [BindSheet](../reference/arkui-ts/ts-universal-attributes-sheet-transition.md) | isShow | 10 | 44 | [BindContentCover](../reference/arkui-ts/ts-universal-attributes-modal-transition.md) | isShow | 10 | 45 | [Refresh](../reference/arkui-ts/ts-container-refresh.md) | refreshing | 8 | 46 | [GridItem](../reference/arkui-ts/ts-container-griditem.md) | selected | 10 | 47 48- $$绑定的变量变化时,会触发UI的同步刷新。 49 50 51## 使用示例 52 53以[TextInput](../reference/arkui-ts/ts-basic-components-textinput.md)方法的text参数为例: 54 55 56```ts 57// xxx.ets 58@Entry 59@Component 60struct TextInputExample { 61 @State text: string = '' 62 controller: TextInputController = new TextInputController() 63 64 build() { 65 Column({ space: 20 }) { 66 Text(this.text) 67 TextInput({ text: $$this.text, placeholder: 'input your word...', controller: this.controller }) 68 .placeholderColor(Color.Grey) 69 .placeholderFont({ size: 14, weight: 400 }) 70 .caretColor(Color.Blue) 71 .width(300) 72 }.width('100%').height('100%').justifyContent(FlexAlign.Center) 73 } 74} 75``` 76 77 78 79