鸿蒙语法、组件、样式

有什么错误请告知我会及时更新容器组件通用事件.onTouch((event: TouchEvent) void) 触摸按下/移动/抬起 全套触发 .onClick(() void) 点击大部分组件都支持 .onLongPress((event: LongPressEvent) void) 长按 .onAppear(() void) 组件显示出来时 .onDisAppear(() void) 组件消失时 .onAreaChange((area: AreaChangeEvent) void) 宽高/位置发生变化时 .onHover((isHover: boolean) void) 鼠标悬停进入/离开 .onFocus(() void) 获得焦点 .onBlur(() void) 失去焦点 .onKeyEvent((event: KeyEvent) void) 键盘按键触发 .onDragStart((event: DragEvent) void) 开始拖拽 .onDragMove((event: DragEvent) void) 拖拽移动中 .onDragEnd((event: DragEvent) void) 拖拽结束 .onDragEnter(() void) 拖拽进入本组件 .onDragLeave(() void) 拖拽离开本组件 .onDrop((event: DragEvent) void) 拖拽松手放下通用样式一、尺寸大小.width(value) // 宽度 .height(value) // 高度 .minWidth(value) // 最小宽 .maxWidth(value) // 最大宽 .minHeight(value) // 最小高 .maxHeight(value) // 最大高 .layoutWeight(value) // 权重Row/Column/Flex二、内外边距.margin(value) // 外边距 .padding(value) // 内边距 对象写法 .margin({ top: 10, left: 20 }) .padding({ all: 15 })三、背景.backgroundColor(color) // 背景颜色 color.red #000 .backgroundImage(url) // 背景图片 .backgroundImageSize(width, height) // 背景图片宽高 .backgroundImagePosition(x, y) //背景偏移 .backgroundBlur(radius) // 背景模糊四、边框 圆角.borderWidth(值) // 边框宽度 .borderColor(色值) // 边框颜色 .borderStyle(样式) // BorderStyle.Solid | Dashed | Dotted .borderRadius(值) // 统一圆角 .borderTopWidth(值) .borderTopColor(色值) .borderTopLeftRadius(值) .borderTopRightRadius(值) .borderBottomLeftRadius(值) .borderBottomRightRadius(值)五、透明度、可见、不可点击.opacity(value) // 0~1 .visibility(visibility) // Visible/Hidden/Gone .enabled(bool) // false不可点击 .touchable(bool) // 是否可触摸六、阴影.shadow(radius) .shadow({ radius: 5, color: #333, offsetX: 2, offsetY: 2 })七、定位 层级.zIndex(value) // 层级 .position({ x, y }) // 相对父组件偏移 .alignment(align) // 在Stack/父容器中的对齐八、变形缩放、旋转、平移.scale(x, y) .rotate(angle) // 角度 .translate(x, y) .transform(matrix) // 矩阵变换九、裁剪 圆角溢出.clip(bool) // 裁剪超出部分 .clipRect(rect) .borderRadius 后超出自动被裁十、布局约束.layoutDirection(direction) // LTR/RTL .alignSelf(align) // 自身在Flex/Row/Column中的对齐 .flexGrow(value) .flexShrink(value) .flexBasis(value)十一、灰化、模糊、高亮.blur(半径) // 模糊 .grayscale(0~1) // 灰度 .brightness(0~∞) // 亮度 .contrast(0~∞) // 对比度 .saturate(0~∞) // 饱和度 .invert(0~1) // 反色十二、动画过渡.transition(transitionObj) // 入场退场动画 .transition({ opacity: 0, // 开始透明 scale: 0.5, // 开始缩小 duration: 300 }) .animation(animationObj) // 属性变化动画 .animation({ duration: 300, // 动画时长毫秒 curve: Curve.EaseInOut, // 动画曲线慢-快-慢 Curve.Linear // 匀速 Curve.EaseIn // 慢进 Curve.EaseOut // 慢出 Curve.EaseInOut // 慢进慢出最常用 Curve.FastOutSlowIn // material 标准曲线 delay: 0, // 延迟多久开始 iterations: 1, // 重复次数 playMode: PlayMode.Normal // 播放模式 })十三、光标样式富交互.cursor(type) // 默认/手指/文本等光标十四、遮罩.mask(image)组件Column() // 垂直.justifyContent(FlexAlign.Start) FlexAlign.Start 默认靠上 FlexAlign.Center 居中 FlexAlign.End 靠下 FlexAlign.SpaceBetween 两端对齐中间均分 FlexAlign.SpaceAround 左右有间距 FlexAlign.SpaceEvenly 平均分布 .alignItems(ItemAlign.Start) ItemAlign.Start 靠左 ItemAlign.Center 居中 ItemAlign.End 靠右 ItemAlign.Stretch 拉伸默认 .space(number | string) 子元素间距 10 || 10vpRow() // 水平.justifyContent(FlexAlign.Start) // 默认左对齐 FlexAlign.Start // 默认左对齐 FlexAlign.Center // 水平居中 FlexAlign.End // 右对齐 FlexAlign.SpaceBetween // 两端贴边中间均分 FlexAlign.SpaceAround // 两边间距中间一半 FlexAlign.SpaceEvenly // 所有间距相等 .alignItems(ItemAlign.Start) // 顶部对齐 ItemAlign.Start ItemAlign.Center ItemAlign.End ItemAlign.Stretch .space(10) // 间距。示例 10 || 10vp .layoutWeight(1) // 权重Stack() // 叠加.align (Alignment) Alignment.TopStart // 左上角 Alignment.TopCenter // 顶部居中 Alignment.TopEnd // 右上角 Alignment.CenterStart // 左侧居中 Alignment.Center // 正中间默认 Alignment.CenterEnd // 右侧居中 Alignment.BottomStart // 左下角 Alignment.BottomCenter // 底部居中 Alignment.BottomEnd // 右下角 .clipContent (boolean) true // 超出部分裁剪默认 false // 超出部分不裁剪Flex() // 弹性布局.justifyContent (FlexAlign) FlexAlign.Start // 主轴起点对齐默认 FlexAlign.Center // 主轴居中 FlexAlign.End // 主轴终点对齐 FlexAlign.SpaceBetween // 两端贴边中间均分 FlexAlign.SpaceAround // 两边间距 中间一半 FlexAlign.SpaceEvenly // 所有间距完全相等 .alignItems (ItemAlign) ItemAlign.Start // 交叉轴起点对齐 ItemAlign.Center // 交叉轴居中 ItemAlign.End // 交叉轴终点对齐 ItemAlign.Stretch // 交叉轴拉伸填满默认 ItemAlign.Auto // 自动 .direction (FlexDirection) FlexDirection.Row // 水平方向默认 FlexDirection.Column // 垂直方向 FlexDirection.RowReverse // 水平反向 FlexDirection.ColumnReverse // 垂直反向 .wrap (FlexWrap) FlexWrap.NoWrap // 不换行挤一行默认 FlexWrap.Wrap // 自动换行 FlexWrap.WrapReverse // 反向换行 .alignContent (FlexAlign) FlexAlign.Start // 多行靠起点 FlexAlign.Center // 多行整体居中 FlexAlign.End // 多行靠终点 FlexAlign.SpaceBetween // 多行两端对齐 FlexAlign.SpaceAround // 多行间距环绕 FlexAlign.SpaceEvenly // 多行间距平均 .space (number | string) 子元素间距 10 || 10vp // 子组件在 Flex 里的独有属性子组件自己用 .flexGrow (number) // 占剩余空间比例 .flexShrink (number) // 空间不足时收缩比例 .flexBasis (Length) // 基准宽度 / 高度 .alignSelf (ItemAlign) // 单独修改交叉轴对齐方式Grid() // 网格.columnsTemplate (string) 1fr 1fr 1fr 3 // 列等宽 100vp 200vp // 固定两列 repeat (4, 1fr) 4 // 列等宽 .rowsTemplate (string) 1fr 1fr 2 // 行等高 100vp 100vp // 固定两行 repeat (3, 1fr) 3 // 行等高 .columnsGap (length) 列间距 10 || 10vp .rowsGap (length) 行间距 10 || 10vp .justifyContent (FlexAlign) FlexAlign.Start // 整体靠左默认 FlexAlign.Center // 整体水平居中 FlexAlign.End // 整体靠右 FlexAlign.SpaceBetween // 左右贴边均分 FlexAlign.SpaceAround // 两边间距 中间一半 FlexAlign.SpaceEvenly // 所有间距相等 .alignItems (ItemAlign) ItemAlign.Start // 子项顶部对齐 ItemAlign.Center // 子项垂直居中 ItemAlign.End // 子项底部对齐 ItemAlign.Stretch // 子项拉伸填满默认 .alignContent (FlexAlign) FlexAlign.Start // 整体靠上 FlexAlign.Center // 整体垂直居中 FlexAlign.End // 整体靠下 FlexAlign.SpaceBetween // 上下均分 FlexAlign.SpaceAround // 上下环绕间距 FlexAlign.SpaceEvenly // 所有间距平均 .layoutDirection (FlexDirection) FlexDirection.Row // 从左到右默认 FlexDirection.RowReverse // 从右到左 FlexDirection.Column // 垂直布局 FlexDirection.ColumnReverse 垂直反向 // Grid 子项独有属性GridItem 用 .gridColumn (number | string) 占几列1 / 3跨第 1~3 列 .gridRow (number | string) 占几行1 / 2跨第 1~2 行GridItem() // Grid 的固定子组件.gridColumn(number | string) 1 // 占第1列 1 // 占第1列 1 / 3 // 从第1列跨到第3列占2列 span 2 // 跨2列 .gridRow(number | string) 1 // 占第1行 1 // 占第1行 1 / 3 // 从第1行跨到第3行占2行 span 2 // 跨2行List() // 长列表.columnsTemplate(string) 1fr // 1列列表默认 1fr 1fr // 2列网格列表 repeat(3,1fr) // 3列网格列表 .rowsTemplate(string) 仅WaterFlow模式使用普通List不用 .alignListItem(ItemAlign) ItemAlign.Start // 子项左对齐 ItemAlign.Center // 子项居中 ItemAlign.End // 子项右对齐 ItemAlign.Stretch // 子项拉伸填满默认 .listDirection(Axis) Axis.Vertical // 垂直列表默认 Axis.Horizontal // 水平列表 .divider({ strokeWidth: number, // 分割线宽度 color?: Color, // 颜色 startMargin?: number, // 左边距 endMargin?: number // 右边距 }) 开启列表分割线 .scrollBar(BarState) BarState.Off // 隐藏滚动条 BarState.On // 显示滚动条 BarState.Auto // 自动显示/隐藏 .edgeEffect(EdgeEffect) EdgeEffect.Spring // 弹簧回弹效果默认 EdgeEffect.Fade // 渐隐效果 EdgeEffect.None // 无效果 .cachedCount(number) 设置预加载item数量优化长列表 .scrollEnabled(boolean) true // 允许滚动默认 false // 禁止滚动ListItem () // List 必须的子组件.sticky(StickyStyle) StickyStyle.None // 不吸顶默认 StickyStyle.Normal // 普通吸顶 StickyStyle.Transparent // 透明吸顶 .align(VerticalAlign) VerticalAlign.Top // 顶部对齐 VerticalAlign.Center // 居中 VerticalAlign.Bottom // 底部对齐 .clickable(boolean) true 可点击默认 false 不响应点击ListItemGroup () // 列表分组可选.header(builder) // 组头 .footer(builder) // 组尾Scroll() // 滚动.scrollable (ScrollDirection) ScrollDirection.Vertical // 垂直滚动默认 ScrollDirection.Horizontal // 水平滚动 ScrollDirection.Both // 双向滚动 .scrollBar (BarState) BarState.Off // 隐藏滚动条 BarState.On // 显示滚动条 BarState.Auto // 滚动时显示 .edgeEffect (EdgeEffect) EdgeEffect.Spring // 弹簧回弹效果默认 EdgeEffect.Fade // 边缘渐隐 EdgeEffect.None // 无效果 .scrollEnabled (boolean) true // 允许滚动默认 false // 禁止滚动Refresh() // 下拉刷新入参 Refresh({ refreshing: $$boolean, // 必选双向绑定刷新状态API11支持元服务 offset: number | string, // 废弃11建议用 refreshOffset取值[0,64vp] friction: number, // 废弃11建议用 pullDownRatio取值0-100 promptText: string, // 12底部自定义提示文本 builder: CustomBuilder, // 10自定义刷新区域12推荐用 refreshingContent 替代 refreshingContent: ComponentContent // 12状态感知的自定义刷新区域 }) 事件 .onStateChange((state: RefreshStatus) void) 状态Inactive/Drag/OverDrag/Refresh/Done .onRefreshing(() void) 进入刷新中时触发需手动将 refreshing 设为 false 结束 .onOffsetChange((offset: number) void) // 12 下拉距离变化时实时回调单位vp .refreshOffset(number) // 12 64vp // 默认无 promptText 96vp // 设置了 promptText 时 .pullToRefresh(boolean) // 12 true // 超过偏移量触发刷新默认 false // 不触发 .pullDownRatio(Optionalnumber) // 12 0-1 // 下拉跟手系数越大越跟手 undefined // 动态自适应 .maxPullDownDistance(Optionalnumber) // 20 undefined // 默认无最大限制 数值 // 最大下拉距离vpSwiper() // 轮播.index (number) 默认 0初始显示第几个子项 .autoPlay (boolean) false 不自动播放默认 true 自动轮播 .interval (number) 自动播放间隔默认 3000 毫秒 .loop (boolean) true 循环播放默认 false 到最后一页停止 .indicator (boolean) true 显示指示器默认 false 隐藏指示器 .indicatorStyle (object) color: 颜色 未选中点颜色 selectedColor: 颜色 选中点颜色 size: 大小 未选中点尺寸 selectedSize: 大小 选中点尺寸 margin: 数字 点之间间距 .duration (number) 滑动动画时长默认 500 毫秒 .vertical (boolean) false 横向轮播默认 true 竖向轮播 .itemSpace (number) 子项之间的间距 .displayCount (number | string) 1 一页显示一个默认 auto 自动适配 数字 一页显示多个 .effect (SwipeEffect) SwipeEffect.Default 平滑滑动默认 SwipeEffect.Scale 渐隐缩放效果 .disableSwipe (boolean) false 允许手势滑动默认 true 禁止手动滑动 独有事件 .onChange ((index: number) void) 页面切换后触发返回当前下标Tabs // 选项卡 / 底部导航.index(number) // 默认选中索引 .barPosition(BarPosition) // 标签位置 BarPosition.Start // 顶部默认 BarPosition.End // 底部常用 BarPosition.Left // 左侧垂直 BarPosition.Right // 右侧垂直 .vertical(boolean) // 垂直布局侧边栏 .scrollable(boolean) // 标签可滚动 .indicatorStyle(...) // 指示器样式颜色、宽高 事件 .onChange((index: number) {}) // 切换时 .onContentWillChange((index: number) boolean) // 切换前拦截可阻止 .onTabBarClick((index: number) {}) // 点击标签TabContent // Tabs独有子组件.tabBar(string | CustomBuilder) // 设置标签文字/自定义交互组件Button().type (ButtonType) ButtonType.Normal 默认矩形 ButtonType.Capsule 胶囊圆角常用 ButtonType.Circle 圆形 ButtonType.Text 纯文本 .stateEffect (boolean) true 启用点击效果默认 false 禁用点击效果TextInput().type (InputType) InputType.Normal 普通文本 InputType.Password 密码 InputType.Number 数字 InputType.Email 邮箱 .placeholder (string) 提示文字 .placeholderColor (Color) 提示文字颜色 .maxLength (number) 最大输入长度 .inputFilter (string) 正则过滤输入 独有事件 .onChange((value: string) {}) .onSubmit((enterKey: EnterKeyType) {})Checkbox().select (boolean) true 选中 false 未选中 .selectedColor (Color) 选中颜色 独有事件 .onChange((value: boolean) {})Radio().value (string) 单选值 .group (string) 分组名同组互斥 .checked (boolean) true 选中 false 未选中 .selectedColor (Color) 选中颜色 独有事件 .onChange((value: boolean) {})Switch().select (boolean) true 开启 false 关闭 .selectedColor (Color) 开启颜色 独有事件 .onChange((value: boolean) {})Slider().min (number) 最小值 .max (number) 最大值 .value (number) 当前值 .step (number) 步长 .trackColor (Color) 轨道底色 .selectedColor (Color) 已选颜色 独有事件 .onChange((value: number) {})Picker().range (string [] | ResourceStr []) 选择项数组 .selected (number) 默认选中项 独有事件 .onChange((value: string, index: number) {})DatePicker().start (Date) 开始日期 .end (Date) 结束日期 .selected (Date) 默认选中日期 .lunar (boolean) true 显示农历 false 不显示 独有事件 .onChange((value: Date) {})导航组件路由Navigation() // 主路由容器.mode(NavigationMode) // 显示模式 NavigationMode.Stack // 单栏手机 NavigationMode.Split // 分栏平板 NavigationMode.Auto // 自动适配推荐 .title(string | CustomBuilder) // 标题支持自定义 .menus(Array | CustomBuilder) // 右上角菜单 .toolBar(CustomBuilder) // 底部工具栏 .hideTitleBar(boolean) // 隐藏标题栏 .navDestination(navMap) // 绑定路由映射 独有事件 .onTitleClick(() {}) // 标题点击 .onNavBarStateChange((isVisible: boolean) {}) // 导航栏显隐NavDestination() // Navigation独有子页面.title(string | CustomBuilder) // 页面标题 .backButtonIcon(Resource) // 返回图标 .hideBackButton(boolean) // 隐藏返回按钮 事件 .onShown(() {}) // 页面显示类似onPageShow .onHidden(() {}) // 页面隐藏 .onBackPressed(() boolean) // 返回拦截返回true拦截NavPathStack // 路由栈方法推入命名路由 navPathStack.pushPath({ name: string }); // 推入页面 推入带参数 navPathStack.pushPath({ name: string, param: Object }); // 带参跳转 弹出栈顶 navPathStack.pop(): NavDestinationInfo | null; // 返回上一页 清空到指定页面 navPathStack.clearTo(name: string): void; // 清空并保留目标页 清空整个栈 navPathStack.clear(): void; // 清空所有页面 获取当前栈信息 navPathStack.getStackInfo(): ArrayNavDestinationInfo; // 获取页面栈 获取栈大小 navPathStack.getStackSize(): number; // 栈长度 推入命名路由核心 navPathStack.pushPath({ name: string }); // 推入命名路由 navPathStack.pushPath({ name: string, param: Object }); // 带参推入 按名称跳转官方正规方法 navPathStack.pushPathByName(name: string); // 按名称推入 navPathStack.pushPathByName(name: string, param: Object); // 带参推入 弹出栈顶 navPathStack.pop(): NavDestinationInfo | null; // 弹出栈顶页面 清空到指定页面 navPathStack.clearTo(name: string): void; // 清空到目标页 清空整个栈 navPathStack.clear(): void; // 清空所有页面 获取当前页面信息 navPathStack.getCurrent(): NavDestinationInfo | null; // 获取当前页面信息 获取指定页面信息 navPathStack.getDestinationInfo(name: string): NavDestinationInfo | undefined;生命周期页面显示 / 隐藏组件级----通用生命周期.onAppear(() { console.log(组件显示了) }) .onDisAppear(() { console.log(组件消失了) }) .onAreaChange((area: AreaChangeEvent) { console.log(宽, area.area.width) })页面级----NavDestination 页面生命周期 只有被 Navigation 包裹的页面才有这一套。.onShown(() { console.log(页面打开/回到前台) // 常用于刷新数据 }) .onHidden(() { console.log(页面被盖住/切走) }) .onBackPress(() { console.log(用户点了返回) return false // 正常返回 // return true // 拦截返回不退出 })组件类组件类自身----Component 组件自身生命周期构造 销毁 Component struct MyComponent { // 1. 构造函数创建时 constructor() { console.log(组件创建) } build() { // ... } // 2. aboutToAppear组件即将显示比 onAppear 更早 aboutToAppear() { console.log(组件即将显示) } // 3. aboutToDisappear组件即将销毁 aboutToDisappear() { console.log(组件即将销毁) } }执行顺序页面打开 constructor() aboutToAppear() onAppear() onShown() 页面关闭 / 返回 onBackPress() onHidden() onDisAppear() aboutToDisappear() 装饰器全集V2 状态管理装饰器API 12 推荐ComponentV2 // 新一代组件定义 struct Demo {} Local // 组件内部私有状态不能传给子组件 Local count: number 0 Param // 子组件接收外部参数支持默认值 Param value: string default Once // 仅初始化同步一次之后不更新 Once initData: string Event // 子组件向父组件抛出事件 Event onChange: () void Provider // 跨层级提供状态后代可消费 Provider userInfo: User Consumer // 消费祖先的 Provider 状态 Consumer userInfo: User Monitor // 监听状态变化替代V1 Watch Monitor(count) onCountChange() {} Computed // 计算属性自动依赖追踪 Computed get doubleCount() { return this.count * 2 } ObservedV2 // V2可观察对象类装饰器 ObservedV2 class User {} Trace // 标记对象属性需要监听 Trace name: string Type // 显式标记属性类型 Type(String) str: string ReusableV2 // 标记V2组件可复用优化性能 ReusableV2 ComponentV2 struct Child {}V1 状态管理装饰器兼容模式Component // 传统组件定义 struct Demo {} State // 组件内部响应式状态 State count: number 0 Prop // 父→子单向绑定 Prop value: number Link // 父子双向绑定 Link count: number Observed // V1可观察对象 Observed class User {} ObjectLink // 对象类型双向绑定 ObjectLink user: User Provide // V1跨层级提供 Provide data: string hi Consume // V1跨层级消费 Consume data: string Watch // 监听状态变化 Watch(count) update() {} StorageLink // AppStorage 双向同步 StorageLink(token) token: string StorageProp // AppStorage 单向同步 StorageProp(uid) uid: string LocalStorageLink // LocalStorage 双向 LocalStorageLink(tab) tab: number LocalStorageProp // LocalStorage 单向 LocalStorageProp(theme) theme: string Track // 对象属性精准追踪 Track name: string Reusable // V1组件复用标记 Reusable Component struct Child {}通用 UI / 工具装饰器Entry // 页面入口 Entry ComponentV2 struct Page {} Preview // IDE预览 Preview ComponentV2 struct PreviewDemo {} Constant // 编译期常量 Constant COLOR #fff Builder // 可复用UI片段 Builder item() { Text() } BuilderParam // 接收父组件UI片段 BuilderParam content: () void Styles // 组件私有样式 Styles style() { .width(100) } Extend // 扩展系统组件样式 Extend(Text) red() { .color(Color.Red) } AnimatableExtend // 可动画样式扩展 AnimatableExtend(Text) animFont() { .fontSize(0) } Require // 构造参数必传校验 Require name: string Concurrent // 并发函数 Concurrent function task() {}常用系统方法一、日志打印console.log(普通日志); // 基本打印日志 console.info(信息日志); // 信息级别日志 console.debug(调试日志); // 调试级别日志 console.warn(警告日志); // 警告级别日志 console.error(错误日志); // 错误级别日志二、路由页面跳转router.pushUrl({ url: pages/Second }); // 跳转到新页面 router.replaceUrl({ url: pages/Second }); // 替换当前页面 router.back(); // 返回上一页 router.getState(); // 获取当前路由信息 router.getStack(); // 获取路由栈列表三、提示与弹窗Toast.show({ message: 操作成功 }); // 轻提示弹窗 AlertDialog.show({ title: , message: }); // 系统确认对话框 ActionSheet.show({ title: , options: [] }); // 底部操作菜单四、定时器setTimeout(() {}, 1000); // 延时执行一次 setInterval(() {}, 1000); // 循环定时执行 clearTimeout(id); // 清除延时器 clearInterval(id); // 清除循环定时器 requestAnimationFrame(() {}); // 下一帧执行五、屏幕与单位转换px2vp(100); // 像素转自适应单位 vp2px(100); // 自适应单位转像素 px2fp(100); // 像素转字体单位 fp2px(100); // 字体单位转像素六、本地存储AppStorage.setOrCreate(key, value); // 设置全局状态 AppStorage.get(key); // 获取全局状态 AppStorage.delete(key); // 删除全局状态 LocalStorage.set(key, value); // 设置页面级存储 LocalStorage.get(key); // 获取页面级存储七、网络请求http.createHttp().request(url, options); // 发起网络请求 http.RequestMethod.GET; // GET请求方式 http.RequestMethod.POST; // POST请求方式八、JSON 处理JSON.stringify(obj); // 对象转JSON字符串 JSON.parse(str); // JSON字符串转对象九、日期时间Date.now(); // 获取当前时间戳 new Date().getFullYear(); // 获取当前年份 new Date().getMonth(); // 获取当前月份(0-11) new Date().getDate(); // 获取当前日期 new Date().getHours(); // 获取当前小时 new Date().getMinutes(); // 获取当前分钟 new Date().getSeconds(); // 获取当前秒数十、数组方法arr.push(item); // 末尾添加元素 arr.pop(); // 删除末尾元素 arr.unshift(item); // 头部添加元素 arr.shift(); // 删除头部元素 arr.splice(index, 1); // 删除指定位置元素 arr.indexOf(item); // 查找元素索引 arr.includes(item); // 判断是否包含元素 arr.forEach(item {}); // 遍历数组 arr.map(item {}); // 数组映射 arr.filter(item true); // 数组过滤 arr.sort((a,b)a-b); // 数组排序 arr.join(,); // 数组转字符串十一、字符串方法str.trim(); // 去除首尾空格 str.indexOf(a); // 查找字符位置 str.includes(a); // 判断是否包含字符 str.split(,); // 字符串切割为数组 str.substring(0,5); // 截取子字符串 str.toUpperCase(); // 转换为大写 str.toLowerCase(); // 转换为小写 str.replace(a,b); // 替换字符十二、数学方法Math.random(); // 生成0-1随机数 Math.round(1.5); // 四舍五入 Math.floor(1.9); // 向下取整 Math.ceil(1.1); // 向上取整 Math.abs(-10); // 取绝对值 Math.max(1,2,3); // 取最大值 Math.min(1,2,3); // 取最小值 Math.pow(2,3); // 计算次方 Math.sqrt(16); // 计算平方根十三、动画方法animateTo({ duration: 300 }, () {}); // 执行显式动画 .transition({ opacity: 0 }); // 组件过渡动画十四、文件操作fileIo.readFile(path); // 读取文件内容 fileIo.writeFile(path, content); // 写入文件内容 fileIo.unlink(path); // 删除文件 fileIo.mkdir(dir); // 创建目录十五、设备信息deviceInfo.deviceType; // 获取设备类型 deviceInfo.marketName; // 获取设备型号 deviceInfo.osFullName; // 获取系统版本十六、生命周期方法aboutToAppear(); // 组件即将创建 aboutToDisappear(); // 组件即将销毁 .onAppear(() {}); // 组件显示 .onDisAppear(() {}); // 组件消失 onShown(() {}); // 页面显示 onHidden(() {}); // 页面隐藏 onBackPress(); // 拦截返回按键十七、常用事件.onClick(() {}); // 点击事件 .onTouch((e) {}); // 触摸事件 .onLongPress(() {}); // 长按事件 .onHover((isHover) {}); // 鼠标悬停事件 .onFocus(() {}); // 获得焦点事件 .onBlur(() {}); // 失去焦点事件 .onChange((value) {}); // 内容变化事件 .onScroll((e) {}); // 滚动事件十八、UI 渲染ForEach(arr, item {}); // 循环渲染组件 LazyForEach(dataProvider, item {}); // 长列表懒加载渲染 if(show) { Text(); } // 条件渲染