XImg
安装
局部注册
全局注册
import { XImg } from 'vux'
export default {
components: {
XImg
}
}
// 在入口文件全局引入
import Vue from 'vue'
import { XImg } from 'vux'
Vue.component('x-img', XImg)
属性
名字 | 类型 | 默认值 | 说明 | 版本要求 |
default-src | string | 默认显示的图片地址 | — | |
src | string | 最终加载的图片地址 | — | |
webp-src | string | webp 格式的图片地址,如果当前浏览器支持webp,则加载该地址 | — | |
error-class | string | 加载失败时添加到 img 元素上的类名 | — | |
success-class | string | 加载成功时添加到 img 元素上的类名 | — | |
offset | number | 100 | 距离多远时开始加载 | — |
container | string | window | 当图片是在一个容器里滚动时(比如demo站点100%高度的布局),你需要指定容器的选择器 | — |
delay | number | 0 | 延迟执行,在存在路由过渡时立即执行可能会导致进入页面后并不会正确加载图片。该属性在 2.5.4 后已经不推荐使用,推荐使用 BusPlugin 来通知组件页面已经载入完成。 | — |
separator | string | 支持设置src的分隔符 | — |
相关 issue
- #2744 [Bug Report] XImg组件的src地址中出现"|"符号时,地址会被截断
- #2413 XImg组件内的 props->offset->default单词写错啦!!导致报错,
- #2314 x-img为什么要在create时走一遍init,mounted时又走一遍
- #1962 xImg单个元素重复绑定了事件
- #1901 XImg图片正确路径重复
- #1833 XImg 图片在 Popup 中无法展示问题
贡献者
该组件(包含文档)迭代次数 15,贡献人数 3
airylandlichunqiangF-loat
发布日志
- v2.9.2 [enhance] 支持设置separator属性 #2744
- v2.6.0 [fix] 当 src 变化时重新初始化 #1901
- v2.5.4 [feature] 在 router-view 动画结束后自动重新监听加载
- v2.1.1-rc.2 [feature] 支持延迟执行属性 delay