#鸿蒙通关秘籍#如何刷新鸿蒙卡片中的本地图片和在线图片？

可以使用FormExtensionAbility处理本地图片和网络图片的刷新。对于本地图片：

javascript import { fileIo } from '@kit.CoreFileKit'; import { formBindingData, FormExtensionAbility } from '@kit.FormKit';

export default class WgtImgUpdateEntryFormAbility extends FormExtensionAbility { onAddForm(want) { let tempDir = this.context.getApplicationContext().tempDir; let imgMap = {}; let file = fileIo.openSync(tempDir + '/' + 'head.PNG'); imgMap['imgBear'] = file.fd;

class FormDataClass {
  text = 'Image: Bear';
  formImages = imgMap;
}
let formData = new FormDataClass();
return formBindingData.createFormBindingData(formData);

} }

对于网络图片，确保请求逻辑在onFormEvent回调中快速完成，以便在卡片刷新的5秒限制内完成：

javascript import { http, fileIo } from '@kit.NetworkKit';

export default class WgtImgUpdateEntryFormAbility extends FormExtensionAbility { onFormEvent(formId, message) { let netFile = 'https://cn-assets.gitee.com/assets/mini_app-e5eee5a21c552b69ae6bf2cf87406b59.jpg'; let tempDir = this.context.getApplicationContext().tempDir; let fileName = 'file' + Date.now(); let tmpFile = tempDir + '/' + fileName;

let httpRequest = http.createHttp();
httpRequest.request(netFile).then((data) => {
  if (data?.responseCode == http.ResponseCode.OK) {
    let imgFile = fileIo.openSync(tmpFile, fileIo.OpenMode.READ_WRITE | fileIo.OpenMode.CREATE);
    fileIo.write(imgFile.fd, data.result as ArrayBuffer).then((writeLen) => {
      fileIo.closeSync(imgFile);
      let imgMap = {};
      let file = fileIo.openSync(tmpFile);
      imgMap[fileName] = file.fd;

      class FormDataClass {
        formImages = imgMap;
      }
      let formData = new FormDataClass();
      formProvider.updateForm(formId, formBindingData.createFormBindingData(formData));
    });
  }
});

} }

在卡片页面中，使用backgroundImage展示传递来的图片。