Skip to content
Projects Vue.js Projects
vue-clip

vue-clip

A minimalistic and hackable file uploader for Vue.js

6.5K viewsAdded Dec 15, 2018

Vue clip is a minimalistic and hackable file uploader for VueJs.

SETUP

You can make use of module by installing it from npm or directly using it from CDN.

Npm

npm i --save vue-clip
import Vue from 'vue'
import VueClip from 'vue-clip'

Vue.use(VueClip)

BASIC USAGE

<template>
  <vue-clip :options="options">
    <template slot="clip-uploader-action">
      <div>
        <div class="dz-message"><h2> Click or Drag and Drop files here upload </h2></div>
      </div>
    </template>

    <template slot="clip-uploader-body" scope="props">
      <div v-for="file in props.files">
        <img v-bind:src="file.dataUrl"/>
        {{ file.name }} {{ file.status }}
      </div>
    </template>

  </vue-clip>
</template>

<script>
  export default {

      data () {
          return {
              options: {
                  url: '/upload',
                  paramName: 'file'
              }
          }
      }

  }
</script>

Vue.js Projects

A hand-picked collection of projects made with Vue.js: UI components, input elements, apps, plugins, examples and frameworks.

Newsletter

Get the best new Vue projects in your inbox.

© 2026 vuejsprojects.com