vue-img-src v2.0.1

vue-img-src

Getting started

Install via npm

# for vue 2.x
npm install vue-img-src@1.x -S
# for vue 3.x
npm install vue-img-src@2.x -S

Install as a Vue plugin

import VueImgSrc from 'vue-img-src'
Vue.use(VueImgSrc, {
  appendQuery: 'format=webp',
})

Using in Vue template

<!-- Directive v-src -->
<img v-src src="http://a.com/a.jpg" >
<!-- rendered dom <img src="http://a.com/a.jpg?format=webp"> -->

<!-- Filter webp 确保此时 imgSrc 为绝对地址-->
<img src="default.png" :data-src="imgSrc | src">

<!-- Method Vue.prototype.toSrc 确保此时 imgSrc 为绝对地址 -->
<img src="toSrc(imgSrc)" >

Default Option