https://github.com/shaoxiong789/vue2.0-image-lazy
vue2.0-image-lazy
https://github.com/shaoxiong789/vue2.0-image-lazy
Last synced: 3 months ago
JSON representation
vue2.0-image-lazy
- Host: GitHub
- URL: https://github.com/shaoxiong789/vue2.0-image-lazy
- Owner: shaoxiong789
- Created: 2017-02-17T08:58:59.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-02-17T10:37:52.000Z (over 8 years ago)
- Last Synced: 2025-01-10T00:56:18.325Z (5 months ago)
- Language: JavaScript
- Homepage: https://shaoxiong789.github.io/vue2.0-image-lazy/example/demo.html
- Size: 787 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# vue2.0-image-lazy
A image lazy loading plugin for vue.
## Demo
[Click me](https://shaoxiong789.github.io/vue2.0-image-lazy/example/demo.html).
## Brower compatibility
IE9+
## Env
[email protected] + webpack + es6
## Install
#### npm
```shell
$ npm install vue2.0-image-lazy
```
## Usage
#### Example
```html
![]()
import 'babel-polyfill'; // es6 shim
import Vue from 'vue';
import vueLazy from 'vue2.0-image-lazy';
Vue.use(vueLazy, {
loading: 'imgs/default.jpg', //default image, if element has 'src' attribute, ignore this
error: 'imgs/error.jpg' //if image load failed, try to load the image
});
new Vue({
el: '#app',
data: {
imgs: [
'imgs/1.jpg',
'imgs/2.jpg',
'imgs/3.jpg',
'imgs/4.jpg',
'imgs/5.jpg',
'imgs/6.jpg',
'imgs/7.jpg',
'imgs/8.jpg'
]
}
});
```