img
网络图片
<img src="图片地址"/>
本地图片
关于本地图片资源打包 file-loader 和 url-loader
import logoImg from '../../assets/logo.png'
export default defineComponent({
setup() {
return {
logoImg,
}
},
});
API
Attributes
| Name | Description | Type | Default |
|---|---|---|---|
| src | 图片地址 | string | — |
| focusable | 是否可以获得焦点 | boolean | false |
| clipChildren | 裁剪子布局 | boolean | false |
| clipPadding | 从padding区域向外裁剪 | boolean | false |
| enableFocusBorder | 是否显示焦点框 | boolean | false |
| focusScale | 焦点放大倍数 | number | 1.1 |
| duplicateParentState | 继承父类的状态 | boolean | false |
| showOnState | 在指定状态显示 | enum | normal |
| backgroundColorStr 2.87 | 以字符串形式指定的背景色 | string | - |
| nextFocusDownSID 2.7 | 向下时指定下一个焦点sid | string | - |
| nextFocusUpSID 2.7 | 向上时指定下一个焦点sid | string | - |
| nextFocusLeftSID 2.7 | 向左时指定下一个焦点sid | string | - |
| nextFocusRightSID 2.7 | 向右时指定下一个焦点sid | string | - |
| nextFocusSID 2.7 | 指定各方向下一个焦点sid | object | - |
| sid 2.7 | 给一个元素标记一个string id，可随意赋值，需确保唯一 | string | - |
| autofocus 2.7 | 组件内根据状态（初始化、可见性改变、尺寸改变)变化自动获焦,focusable为true时自己获焦 | boolean | false |
| viewLayerType | 设置layerType | enum | - |
| clipBounds | 设置裁剪区域 | object | - |
| name | 指定元素的name | string | - |
| nextFocusName | 指定各方向下一个焦点元素的name | object | - |
| focusScaleDuplicateParentState | 焦点放大继承父类的状态 | boolean | false |
| selected | 选择状态 | boolean | false |
| visible | 是否可见 | boolean | false |
| visibility | 可见性 | enum | visible |
| size | 设置元素大小 | array | - |
| layout | 设置元素位置及大小 | array | - |
| enableFade 2.87 | 开启图片加载淡入效果 | boolean | false |
| fadeDuration 2.87 | 淡入效果时间 | number | 200ms |
| postDelay | 延迟图片加载以优化性能 | number | 0ms |
| colorFilter 2.6 | colorFilter | number | - |
| tintColor 2.6 | tintColor | number | - |
| resizeMode | resizeMode | string | - |
Events
| Name | Description | Type |
|---|---|---|
| layout | 当元素挂载或者布局改变的时候调用。 | Function |
| load | 加载成功完成时调用此回调函数。 | Function |
| loadStart | 加载开始时调用。 | Function |
| loadEnd | 加载结束后，不论成功还是失败，调用此回调函数。 | Function |
| error | 当加载错误的时候调用此回调函数。 | Function |
| progress | 当加载错误的时候调用此回调函数。 | Function |
Exposes
| Method | Description | Type |
|---|---|---|
| setSrc | 设置图片地址 | Function |
| resizeMode | 重置尺寸模式 | Function |
| requestFocus | 请求焦点 | Function |
| clearFocus | 清除焦点 | Function |
| requestFocusDirectly | 直接请求焦点 | Function |
| setVisibility | 设置是否可见 | Function |
| changeDescendantFocusability | 改变子元素获焦策略 | Function |
| setBackGroundColor | 设置背景色 | Function |
| blockRootFocus | 阻塞焦点 | Function |
| unBlockRootFocus | 取消阻塞焦点 | Function |
| changeAlpha | 设置alpha | Function |
| setScale | 设置形变 | Function |
| setPosition | 设置位置 | Function |
| updateLayout | 改变布局 | Function |
| invalidate | 刷新布局 | Function |
| setBlockFocusDirections | 设置阻塞焦点的方向 | Function |
| setBlockFocusDirectionsOnFail | 失败的时候设置阻塞焦点的方向 | Function |
| hasFocus | 是否有焦点 | Function |
| isFocused | 是否获得了焦点 | Function |
| getLocationOnScreen | 获取在屏幕上的位置 | Function |
| getViewState | 获取视图的状态 | Function |
| getChildViewState | 获取孩子视图的状态 | Function |
| changeVisibility | 设置可见性 | Function |