图片容器

引入

import { TmImage } from '@huteming/ui'

Vue.use(TmImage)
// Vue.component(TmImage.name, TmImage)

例子

<tm-image :src="src" style="width: 100px; height: 100px;"></tm-image>

API

| 参数 | 说明 | 类型 | 可选值 | 默认值 | |------|-------|---------|-------|--------| | src | 图片地址 | String | | | | fit | 确定图片如何适应容器框，同原生 object-fit | string | fill / contain / cover / none / scale-down | | | lazy | 是否开启懒加载 | boolean | | false | | hold | 初始为添加图片样式，src改变后会被覆盖 | boolean | | false | | scroll-container | 开启懒加载后，监听 scroll 事件的容器 | string / HTMLElement | | 最近一个 overflow 值为 auto 或 scroll 的父元素 |

Events

| 事件名称 | 说明 | 回调参数 | |---------|----------|-------------| | load | 图片加载成功触发 | (e: Event) | | error | 图片加载失败触发 | (e: Error) |

Slots

| 名称 | 说明 | |------------|----------| | placeholder | 添加图片样式占位 | | loading | 加载中的内容 | | error | 加载失败的内容 |