1e41f4b71Sopenharmony_ci# ImageData对象
2e41f4b71Sopenharmony_ci
3e41f4b71Sopenharmony_ci>  **说明:**
4e41f4b71Sopenharmony_ci>  从API version 4开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
5e41f4b71Sopenharmony_ci
6e41f4b71Sopenharmony_ciImageData对象可以存储[canvas组件](js-components-canvas-canvas.md)渲染的像素数据。
7e41f4b71Sopenharmony_ci
8e41f4b71Sopenharmony_ci
9e41f4b71Sopenharmony_ci## 属性
10e41f4b71Sopenharmony_ci
11e41f4b71Sopenharmony_ci| 属性     | 类型                        | 描述                           |
12e41f4b71Sopenharmony_ci| ------ | ------------------------- | ---------------------------- |
13e41f4b71Sopenharmony_ci| width  | number                    | 矩形区域实际像素宽度。                  |
14e41f4b71Sopenharmony_ci| height | number                    | 矩形区域实际像素高度。                  |
15e41f4b71Sopenharmony_ci| data   | <Uint8ClampedArray> | 一维数组,保存了相应的颜色数据,数据值范围为0到255。 |
16e41f4b71Sopenharmony_ci
17e41f4b71Sopenharmony_ci
18e41f4b71Sopenharmony_ci## 示例
19e41f4b71Sopenharmony_ci
20e41f4b71Sopenharmony_ci```html
21e41f4b71Sopenharmony_ci<!-- xxx.hml -->
22e41f4b71Sopenharmony_ci<div>
23e41f4b71Sopenharmony_ci  <canvas ref="canvas" style="width: 500px; height: 500px; background-color: #ffff00;"></canvas>
24e41f4b71Sopenharmony_ci</div>
25e41f4b71Sopenharmony_ci```
26e41f4b71Sopenharmony_ci
27e41f4b71Sopenharmony_ci```js
28e41f4b71Sopenharmony_ci// xxx.js
29e41f4b71Sopenharmony_ciimport promptAction from '@ohos.promptAction';
30e41f4b71Sopenharmony_ciexport default {
31e41f4b71Sopenharmony_ci  onShow() {
32e41f4b71Sopenharmony_ci    const el =this.$refs.canvas;
33e41f4b71Sopenharmony_ci    const ctx = el.getContext('2d');
34e41f4b71Sopenharmony_ci    ctx.fillRect(0,0,200,200)
35e41f4b71Sopenharmony_ci    var imageData = ctx.createImageData(1,1)
36e41f4b71Sopenharmony_ci    promptAction.showToast({
37e41f4b71Sopenharmony_ci      message:imageData,
38e41f4b71Sopenharmony_ci      duration:5000
39e41f4b71Sopenharmony_ci    })
40e41f4b71Sopenharmony_ci  }
41e41f4b71Sopenharmony_ci}
42e41f4b71Sopenharmony_ci```
43