A media uploader component that allows for multiple image upload with live preview.
How to use it:
1. Import the Media-Upload component.
import {UploadMedia, UpdateMedia} from "@s1modev/media-upload";
export default {
components: {
UploadMedia,
UpdateMedia
}
};
// OR
import { createApp } from 'vue';
import { UploadMedia, UpdateMedia } from '@s1modev/media-upload';
let app=createApp({})
app.component('upload-media' , UploadMedia);
app.component('update-media' , UpdateMedia);
app.mount("#app")
2. Create the image uploader:
// Create Form
<div id="app">
<upload-media
server="/api/upload"
error="@error('media'){{$message}}@enderror">
</upload-media>
</div>
// Update Form
<div id="app">
<update-media
server="/api/upload"
media_file_path="/post_images"
media_server="/api/media/{{$post->id}}"
error="@error('media'){{$message}}@enderror">
</update-media>
</div>
Preview:
Download Details:
Author: s1modev
Live Demo: https://github.com/s1modev/media-upload-demo
Download Link: https://github.com/s1modev/media-upload/archive/refs/heads/main.zip
Official Website: https://github.com/s1modev/media-upload
Install & Download:
# Yarn
$ yarn add @s1modev/media-upload
# NPM
$ npm i @s1modev/media-upload