HarmonyOS:$$语法:内置组件双向同步
$$运算符为系统内置组件提供TS变量的引用,使得TS变量和系统内置组件的内部状态保持同步。
内部状态具体指什么取决于组件。例如,TextInput组件的text参数。
说明
$$还用于@Builder装饰器的按引用传递参数,开发者需要注意两种用法的区别。
一、使用规则
当前$$支持基础类型变量,以及@State、@Link和@Prop装饰的变量。
当前$$支持的组件:
| 组件 | 支持的参数/属性 | 起始API版本 |
|---|---|---|
| Checkbox | select | 10 |
| CheckboxGroup | selectAll | 10 |
| DatePicker | selected | 10 |
| TimePicker | selected | 10 |
| MenuItem | selected | 10 |
| Panel | mode | 10 |
| Radio | checked | 10 |
| Rating | rating | 10 |
| Search | value | 10 |
| SideBarContainer | showSideBar | 10 |
| Slider | value | 10 |
| Stepper | index | 10 |
| Swiper | index | 10 |
| Tabs | index | 10 |
| TextArea | text | 10 |
| TextInput | text | 10 |
| TextPicker | selected、 | value |
| Toggle | isOn 10 | |
| AlphabetIndexer | selected | 10 |
| Select | selected、 | value 10 |
| BindSheet | isShow | 10 |
| BindContentCover | isShow | 10 |
| Refresh | refreshing | 8 |
| GridItem | selected | 10 |
| ListItem | selected | 10 |
- $$绑定的变量变化时,会触发UI的同步刷新。
二、使用示例
以TextInput方法的text参数为例:
// TextInputExample.ets
@Entry
@Component
struct TextInputExample {@State text: string = ''controller: TextInputController = new TextInputController()build() {Column({ space: 20 }) {Text(this.text)TextInput({ text: $$this.text, placeholder: 'input your word...', controller: this.controller }).placeholderColor(Color.Grey).placeholderFont({ size: 14, weight: 400 }).caretColor(Color.Blue).width(300)}.width('100%').height('100%').justifyContent(FlexAlign.Center)}
}
效果图

