前言随着 HarmonyOS NEXT 正式进入快速发展阶段越来越多开发者开始接触 ArkTS 开发。很多刚从 Java、Kotlin、Vue、React 转过来的开发者经常会遇到这样的问题状态更新为什么不生效State 和 Prop 到底有什么区别页面数据如何优雅传递List 为什么会卡顿页面销毁后为什么内存没有释放本文结合实际项目经验总结10个高频开发技巧希望帮助大家快速提升鸿蒙开发效率。1. 优先使用Builder封装重复UI很多新手喜欢复制粘贴代码Row() { Image($r(app.media.avatar)) .width(40) .height(40) Text(张三) }如果项目里出现几十次Builder UserItem(name: string) { Row() { Image($r(app.media.avatar)) .width(40) .height(40) Text(name) .margin({ left: 10 }) } }调用this.UserItem(张三)优势提高复用性降低维护成本提升代码可读性2. List必须配置LazyForEach错误写法ForEach(this.dataList,(item){ ListItem(){ Text(item.name) } })数据量超过500条时容易卡顿。推荐LazyForEach( this.dataSource, (item) { ListItem() { Text(item.name) } } )原因LazyForEach采用懒加载机制。只渲染当前可见区域。企业项目基本标配。3. 善用状态管理很多同学分不清State Prop Link Provide Consume记住一个口诀页面内部State 父传子Prop 双向绑定Link 跨层传递Provide Consume实际开发中80%场景State15%场景Prop Link5%场景Provide Consume4. 网络请求统一封装不要在页面中直接写axios.get(...)推荐api/ ├── userApi.ts ├── orderApi.ts ├── goodsApi.ts例如export function getUserInfo() { return request({ url:/user/info, method:GET }) }页面getUserInfo()优点统一维护方便切换接口支持统一拦截器5. 页面参数统一管理跳转router.pushUrl({ url:pages/Detail, params:{ id:1001 } })接收let params router.getParams()推荐建立types/router.ts统一定义参数类型。避免大型项目参数混乱。6. 图片资源不要全部放本地很多项目把所有图片放resources最终导致HAP包体积暴涨推荐图标 - 本地 商品图 - OSS Banner - CDN企业项目基本如此。启动速度更快。7. Toast统一封装不要每个页面都写promptAction.showToast({ message:成功 })统一Toast.show(成功)后续切换样式无需修改业务代码。8. 页面离开及时释放资源例如Web组件 视频播放器 地图组件 定时器页面退出aboutToDisappear() { clearInterval(this.timer) }否则容易内存泄漏 页面卡顿 耗电增加9. 善用TypeScript类型约束不要let user:any推荐interface User { id:number name:string age:number }使用let user:User好处自动提示编译检查降低Bug率10. 建立项目统一目录规范推荐企业级结构src │ ├── pages │ ├── components │ ├── api │ ├── utils │ ├── model │ ├── constants │ ├── common │ ├── router │ └── resources这样即使项目达到100 页面 50 接口依然容易维护。企业项目开发建议很多开发者刚接触鸿蒙时喜欢功能先实现再说结果代码越来越乱 组件越来越难维护 项目越来越难扩展正确思路应该是组件化 模块化 类型化 统一封装 统一规范这也是目前大部分 HarmonyOS NEXT 企业项目采用的开发模式。总结ArkTS 并不难真正难的是工程化思维。掌握本文这10个开发技巧后你会发现✅ 页面开发速度更快✅ 代码结构更清晰✅ 项目更容易维护✅ 更接近企业级开发标准对于刚入门 HarmonyOS NEXT 的开发者来说与其学习大量零散知识不如先养成良好的开发习惯。因为真正拉开开发者差距的往往不是会不会写页面而是会不会写一个能长期维护的项目。
