鸿蒙前端笔记

最新推荐文章于 2024-06-26 16:30:13 发布

七沫池440

最新推荐文章于 2024-06-26 16:30:13 发布

阅读量164

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/qq_61646176/article/details/125233799

版权

1 目录简绍

2 文件访问规则

3 注意事项

4 部分函数构建

1 目录简绍

目录结构中文件分类如下：

.hml 结尾的 HML 模板文件，这个文件用来描述当前页面的文件布局结构。
.css 结尾的 CSS 样式文件，这个文件用于描述页面样式。
.js 结尾的 JS 文件，这个文件用于处理页面和用户的交互。

各个文件夹的作用：

app.js 文件用于全局 JavaScript 逻辑和应用生命周期管理。
pages 目录用于存放所有组件页面。
common 目录用于存放公共资源文件，比如：媒体资源和 JS 文件。
i18n 目录用于配置不同语言场景资源内容，比如：应用文本词条，图片路径等资源，注意 i18n 是开发保留文件夹，不可重命名。

2 文件访问规则

1. 应用资源可通过绝对路径或相对路径的方式进行访问，本开发框架中绝对路径以 "/" 开头，相对路径以 "./" 或 "../" ，具体访问规则如下：
- 引用代码文件，需使用相对路径，比如：../common/utils.js。
- 引用资源文件，推荐使用绝对路径。比如：/common/xxx.png。
- 公共代码文件和资源文件推荐放在 common 下，通过以上两条规则进行访问。
- CSS 样式文件中通过 url() 函数创建数据类型，如：url(/common/xxx.png)。
- 如果代码文件A和文件B位于同一目录，则代码文件B引用资源文件时可使用相对路径，也可使用绝对路径。
- 如果代码文件A和文件B位于不同目录，则代码文件B引用资源文件时必须使用绝对路径。因为Webpack打包时，代码文件B的目录会发生变化。
1. 媒体文件格式
格式支持版本支持的文件类型
BMP API Version 3+ .bmp
JPEG API Version 3+ .jpg
PNG API Version 3+ .png
1. app.js 标签中包含了实例名称、页面路由信息。
标签类型默认值必填描述
name string default 是标识JS实例的名字。
pages Array - 是路由信息，详见“pages”。

name、pages 标签配置需在配置文件中的 js 标签中完成设置。pages 定义每个页面的路由信息，每个页面由页面路径和页面名组成，页面的文件名就是页面名。比如：
```
{  ...  "pages": [    "pages/index/index",    "pages/detail/detail"  ]  ...}
```
说明
- 应用首页固定为 "pages/index/index"。
- 页面文件名不能使用组件名称，比如：text.hml、button.hml 等。
1. 每个应用可以在 app.js 自定义应用级生命周期的实现逻辑，包括：
- onCreate：在应用生成时被调用的生命周期函数。
- onDestory：在应用销毁时被调用的生命周期函数。