Image

Display images with configurable sizing hints and object-fit behavior.

组件展示

16 : 9
4 : 3
2 : 1
1 : 1

属性

属性名
类型
必需性
描述
id*
ComponentId
必需
暂无描述
accessibility
AccessibilityAttributes
可选
暂无描述
styles
Styles
可选
Component style properties
weight
number
可选
The relative weight of this component within a Row or Column. This is similar to the CSS 'flex-grow' property. Note: this may ONLY be set when the component is a direct descendant of a Row or Column.
component*
"Image"
必需
暂无描述
url*
string | DataBinding | object
必需
Represents a string
fit
"contain" | "cover" | "fill" | "none" | "scale-down"
可选
Specifies how the image should be resized to fit its container. This corresponds to the CSS 'object-fit' property.
可选值: contain, cover, fill, none, scale-down
variant
"icon" | "avatar" | "smallFeature" | "mediumFeature" | "largeFeature" | "header"
可选
A hint for the image size and style.
可选值: icon, avatar, smallFeature, mediumFeature, largeFeature, header

代码示例

{
  "component": "Image",
  "id": "image_1",
  "url": "示例url"
}