---
title: 'javascript 代码'
description: '用来定义页面数据和实现生命周期接口'
lastUpdated: 2025-05-20T06:21:12.000Z
---
用来定义页面数据和实现生命周期接口
## 语法
支持 ES6 语法
### 模块声明
蓝河应用中支持`ES6`的`module`标准，使用`import`引入 js 依赖，同时支持 CommonJs 规范，使用`require`引入 js 依赖（具体参看功能接口部分文档说明）
```ts
// 首先在 `manifest.json` 中配置 `fetch` 接口
// require引入
const fetch = require('@blueos.communication.network.fetch')
// import引入
import fetch from '@blueos.communication.network.fetch'
```
### 代码引用
JS 代码引用推荐使用 import 来导入, 例如：
```ts
import utils from '../Common/utils.js'
```
**注意**： 蓝河应用环境不是 node 环境，不要引用 node 原生模块，如 `import fs from 'fs'`
## 对象
蓝河应用的组件对象提供了一些属性和方法，用于控制组件的渲染、数据处理、组件逻辑等方面
### 页面级组件对象
| 属性 | 类型 | 描述 |
| --- | --- | --- |
| data | Object | Function | 页面级组件的数据模型，能够转换为 JSON 对象；属性名不能以$或\_开头, 不要使用 for, if, show, tid 等保留字
如果是函数，返回结果必须是对象，在组件初始化时会执行函数获取结果作为 data 的值
使用 data 方式声明的属性会被外部数据覆盖，因此存在一定安全风险。 |
#### 示例
```ts
{{title}]
```
### 自定义组件对象
| 属性 | 类型 | 描述 |
| --- | --- | --- |
| data | Object | Function | 自定义组件的数据模型，能够转换为 JSON 对象；属性名不能以$或\_开头, 不要使用 for, if, show, tid 等保留字
如果是函数，返回结果必须是对象，在组件初始化时会执行函数获取结果作为 data 的值 |
| props | Array | Object | 定义组件外部可传入的所有属性；属性名不能以$或\_开头, 不要使用 for, if, show, tid 等保留字
在模板代码中，请使用短横线分隔命名代替驼峰命名。如，属性定义 props: \['propA'\]，可通过``方式传递到组件内部 |
#### 示例
```ts
{{title}]
{{name}]
```
想了解更多信息可以参考[自定义组件](/d1fdaffab435ae87702643b278392a52/parent-child-component-communication.md)
### 公共对象
| 属性 | 类型 | 描述 |
| --- | --- | --- |
| $app | Object | 应用对象 |
| $page | Object | 页面对象 |
| $valid | Boolean | 页面对象是否有效 |
| $device | { deviceType: string } | 获取当前设备类型。`watch-square`：方形手表，`watch-round`：圆形手表 |
### 应用对象
可通过`$app`访问
| 属性 | 类型 | 描述 |
| --- | --- | --- |
| $def | Object | 使用`this.$app.$def`获取在`app.ux`中暴露的对象 |
## 方法
### 公共方法
| 属性 | 类型 | 参数 | 描述 |
| --- | --- | --- | --- |
| $element | Function | id: String 组件 id | 获取指定 id 的组件调用来对应的组件方法 |
| $set | Function | key: String 属性名称
value: Any | 添加数据属性，用法：`this.$set('key',value)` |
### 事件方法
| 属性 | 类型 | 参数 | 描述 |
| --- | --- | --- | --- |
| $watch | Function | data: String 属性名, 支持'a.b.c'格式，不支持数组索引
handler: String 事件句柄函数名, 函数的第一个参数为新的属性值，第二个参数为旧的属性值 | 动态添加属性/事件绑定，属性必须在 data 中定义，handler 函数必须在`