发布于 

HarmonyOS ArkTS 开发体验

DevEco Studio

DevEco Studio

指定编译器,JetBrains风格界面,对于WebStorm用惯的Web开发者非常熟悉。

使用指南

当前问题
  • 插件比较少
  • 版本混乱
    • 文档版本和SDK版本相关,官方推荐的NEXT文档主要针对API(9-11)
    • SDK版本和DevEco版本挂钩,稳定版本的DevEco只能安装9及以下的API,高版本需要下载Beta版本
    • 模拟器版本需要和API一致,高版本模拟器现在要使用需要申请权限

项目与文件

  • 项目创建:
    • 项目创建时选SDK一定要看清楚
    • 如果没有高版本的SDK,可能是因为DevEco Studio的版本过低,需要更新
  • 文件新建
    • ArkTs中大部分指向明确的文件结构,都能在目录结构树中找到快捷方式创建

DevEco有时会把ts文件编译成js和js.map类型的文件,
破坏项目目录结构,
目前社区内的解决方案是用插件一键删除:

ArkCompilerSupport

Previewer 视图

  • 视图会显示鼠标最近一次聚焦的页面
  • 视图调试的日志,需要在Log选项卡中对日志进行筛选:Previewer
  • 视图提供可视化编辑的画页面方法
  • 视图内能对屏幕进行拉伸操作
  • 视图不仅仅显示静态页面,网络请求也会执行
  • 视图内不能显示Web标签加载页面

调试

  • 模拟器
    • 模拟器的SDK需要和项目的SDK匹配
    • 模拟器配置后能够热更新,但是热更新的范围很小,大多数情况还是使用Previewer
  • 日志Log
    • 打印日志尽量带上标识符,不然被日志刷屏时一脸懵逼

基于ArkTS的声明式开发范式

ArkTS

ArkTS声明式语法习惯了就还好,
比较麻烦的就是没有样式复用,整体看来比较类似于Vue2的框架风格

UIAbility

ets下会自动生成entryability/EntryAbility.ts文件,
生成UIAbility窗口,包含App首页的加载,对整个App生命周期以及事件的挂载:
UIAbility组件

修饰符

ArkTs使用修饰符来标明数据、方法的属性,
父子组件之间值的传递与vue比较相似

组件状态管理

和Vue的使用方式也很像,包括父子组件之间数值的传递。

但是能够将组件逻辑直接书写在组件声明内部这一点还是相当方便的。

其它
demo

参考项目:
若依移动端鸿蒙版

项目地址:

APP截图
登录页首页列表页个人主页

兼容JS的类Web开发范式

开发风格比较类似于Vue,html、js、css三部分拆分后又作为一个整体页面/组件,
整体感觉比较厚重,既没有原生Js的那种高度整合性,又不如ArkTS高效

APP截图
登录页注册页首页
列表菜单整体流程