很久没写博客了，最近入坑了鸿蒙HarmonyOS 4.0，ArkTs！

简单记录一些小笔记：

// @Component表示自定义组件，
// @Entry表示该自定义组件为入口组件，
// @State表示组件中的状态变量，状态变量变化会触发UI刷新。
// 不加 @State 装饰器的话，也可以改值，但是视图不会变，从而达不到双向绑定的效果
// test:string = 'hello word'
// @Prop 不能够初始化
// @Link 不能在组件内部初始化

// 右键-new新建页面
// page 会自动在resources/base/profile/main_pages.json里面添加该路径
// 而新建 ArkTs File 则不会

// build{} 就相当于vue中的 <template>，它里面的根节点只能有一个
// 不加外面这层的话，写两个Test()就会报错

// @Prop value:string;  // 不需要初始值
// @State value:string = '';  // 需要初始值

// export default struct Title { }
// 加 default 和不加的区别，加的话外面引用不需要花括号{}

踩到的坑：

1，ArkUi 提供的布局方式有很多，Column，Row，RelativeContainer 相对定位，Stack堆叠，弹性布局Flex等等...

但是相比较于前端css还是略有差别，Flex感觉不如css的好用

没有了绝对定位，增加了Stack堆叠布局，毕竟是手机app，手机屏幕，平板等大小也各不相同，布局大多使用百分比，和居中居左居右就可以满足了，不需要绝对定位到多少像素

没有了float浮动，这个css很常用的局部方式，少了之后开始写起来总感觉怪怪的，两个盒子一个靠左一个靠右就需要 justify-content:space-between 或者其他拐方法，而官方不推荐使用Flex（会造成二次渲染），好在Row和Column提供了这些属性可以直接使用，还是需要习惯后才能写起来行如流水。

2，正常的我们完全不需要考虑div里内容纵向排列超出后的滚动条，因为他会自动出现，而在ArkUi里，Column是不支持滚动的，超出后就真的被“挤”没了，如果要滚动，则需要设置父盒子为 Scroll , List , Grid 等支持滚动的组件，这里有个坑，就是如果出现滚动元素嵌套的情况，则会出现两个滚动条“不和谐”的情况，影响体验，论坛看了好多人有同样的问题，有使用禁用滚动事件等解决方法试了之后体验也不是很良好，期待后续官方更新吧。。

3，对于build{}组件内部，ForEach循环输出的必须为组件，想要写一些处理方法还需要去外部单独定义

4，还有很多忘了等想起来再补充。。。