vue-image-painter
vue-image-painter copied to clipboard
๐โโ๏ธ Image magic animation drawing effect component for Vue 2.x | ๅพๅๅจๆ็ปๅถๆๆ
vue-image-painter
English | ็ฎไฝไธญๆ
๐ฐ Example
๐ QuickStart
- Install
yarn add vue-image-painter # OR npm i -S vue-image-painter
- Import
// main.js
import ImagePainter from 'vue-image-painter'
Vue.use(ImagePainter)
- Usage. Please refer to the Demo Source Code
<ImagePainter :src="https://www.images.com/a.jpg"></ImagePainter>
๐ API
Props
| Name | Description | Type | Default |
|---|---|---|---|
| src | image URL. local images must be used require('') |
String | undefined |
| alt | image alt | String | undefined |
| animation | animation effect. optional key: 'draw'๏ผ'blur' | String | 'draw' |
| duration | animation duration. unit: ms | Number | 4000 |
| immediate | display images and animations immediately, don't wait for the image to load | Boolean | false |
Events
| Name | Description | Parameters |
|---|---|---|
| loadStart | image load start | null |
| loadEnd | image load end | null |
Slots
| Name | Description |
|---|---|
| default | The content ImagePainter displays, before the image is loaded |
๐๐ If it is helpful to you๏ผplease encourage me with a โญ๏ธStar ~
Inspiration
Changelog
License
Copyright (c) 2018-present, komo