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