vue-img-tag

pkg.module supported, which means that you can apply tree-shaking in you project

A simple vue2 component, just for img preview, can be used to image input preview

repository

https://github.com/livelybone/vue-img-tag.git

Demo

https://livelybone.github.io/vue/vue-img-tag/

Example

See: example

Installation

npm i -S vue-img-tag

Global name

VueImgTag

Usage

// import all
import VueImgTag from 'vue-img-tag';

// Global register
Vue.component('img-tag', VueImgTag);

// Local register
new Vue({
  components:{VueImgTag}
})

Props

| Name | Type | DefaultValue | Description | | ----------------- | ----------------------------------------- | -------------------- | ------------ | | lazy | Boolean | false | Enable lazy mode or not | | loadingImg | String | none | Can be url or color(should be rgb, rgba or hex) | | errorImg | String | none | Don't set to color, only url allowed | | src | [String, FileList, File, Promise] | none | | | preventValue | Number | 0 | The boundary condition | | event | Object | defaultConf | Config of event which is use to judge whether img should load or not, especially useful when lazy mode is enabled |

const defaultConf = {
  eventName: 'scroll', // The event listened to
  eventTarget: window, // what dom do event triggered on
}