img function

Component img({
  1. String? alt,
  2. CrossOrigin? crossOrigin,
  3. int? width,
  4. int? height,
  5. MediaLoading? loading,
  6. required String src,
  7. ReferrerPolicy? referrerPolicy,
  8. Key? key,
  9. String? id,
  10. String? classes,
  11. Styles? styles,
  12. Map<String, String>? attributes,
  13. Map<String, EventCallback>? events,
})

The <img> HTML element embeds an image into the document.

  • alt: Defines an alternative text description of the image
  • crossOrigin: Indicates if the fetching of the image must be done using a CORS request.
  • width: The intrinsic width of the image in pixels.
  • height: The intrinsic height of the image, in pixels.
  • loading: Indicates how the browser should load the image.
  • src: The image URL.
  • referrerPolicy: Indicates which referrer to send when fetching the resource.

Implementation

Component img(
    {String? alt,
    CrossOrigin? crossOrigin,
    int? width,
    int? height,
    MediaLoading? loading,
    required String src,
    ReferrerPolicy? referrerPolicy,
    Key? key,
    String? id,
    String? classes,
    Styles? styles,
    Map<String, String>? attributes,
    Map<String, EventCallback>? events}) {
  return DomComponent(
    tag: 'img',
    key: key,
    id: id,
    classes: classes,
    styles: styles,
    attributes: {
      ...attributes ?? {},
      if (alt != null) 'alt': alt,
      if (crossOrigin != null) 'crossorigin': crossOrigin.value,
      if (width != null) 'width': '$width',
      if (height != null) 'height': '$height',
      if (loading != null) 'loading': loading.value,
      'src': src,
      if (referrerPolicy != null) 'referrerpolicy': referrerPolicy.value,
    },
    events: events,
  );
}