We are so happy to release the new version of vue-core-image-upload. We try to fix some bugs and support some new features. As the slogan:
Do More For You
We try to add some new features to handle the image files via pure javascript. There are some new features:
- Compress image in local browser
- Crop image via canvas
- Multiple files
- New crop section style
We have heard some good suggestions from our users. And those features are so useful and ease to use.
New Crop Section Style
We add a white mask for crop section area. And we change the resize button to be a circle and make it larger.
Compress Image In Local Browser
We add new props compress. Props compress means the quality of the image you want to compress via browser and then send the compressed image to the server. It is more friendly to mobile devices for saving your network traffic.
Code Example
<vue-core-image-upload
:class="['btn', 'btn-primary']"
@imageuploaded="imageUploded"
:max-file-size="5242880"
compress="50"
url="http://101.198.151.190/api/upload.php" >
</vue-core-image-upload>
Multiple Files
Set props multiple equal true, and you could select more than one file. And your server will receive an array of files.multiple-size is a number which limits your count of the files you selected.
<vue-core-image-upload
:class="['btn', 'btn-primary']"
:crop="false"
@imageuploaded="imageUploded"
:max-file-size="5242880"
:multiple="true"
:multiple-size="4"
url="http://101.198.151.190/api/upload2.php" >
</vue-core-image-upload>
Crop Image Via Canvas
We are also excited about support this feature. crop="local" The Browser will crop the image via canvas API and send the cropped image to the server. You will see HTTP form data like this:
Code example
<vue-core-image-upload
crop-ratio="1:1"
:class="['btn', 'btn-primary']"
crop="local"
url="http://101.198.151.190/api/crop.php"
extensions="png,gif,jpeg,jpg"
text="Crop Image"
@imageuploaded="crpoServerImageUploaded">
</vue-core-image-upload>
Update New Document Website
We re-build our document webiste and we provide English document too. The code source are here.
The Future
Of course in the future, we'll change some style when cropping the image on mobile devices and fix the new bugs.