vue-six-four

vue-six-four

vue 2.x.x component which generate base64 from a file Demo Demo Umd

Install

npm install vue-six-four --save

Usage

import VueSixFour from 'vue-six-four';

or include the umd version in a script tag

<script src="https://unpkg.com/vue-six-four/dist/vue-six-four.umd.min.js"></script>

// Include as a component
{
  components: {
		VueSixFour,
		// if you are using the umd version
		// VueSixFour: window.VueSixFour.default,
  },
  methods: {
    getFileInfo(file) {
      console.log('File Information', file);
    },
  },
}

<vue-six-four v-on:vue-six-four="getFileInfo">

In this event you can get the information of the whole file.

{
  "lastModified": 1491695457000,
  "lastModifiedDate" : "Sat Apr 08 2017 18:50:57 GMT-0500 (-05)",
  "name" : "fileName.jpg",
  "size" : "14361",
  "type" : "image/jpeg",
  "sixFour": "really long base64 here"
}

Multiple Files

By default the component only allows to select one file, but you can change that using the allow-multiple prop.

<vue-six-four v-on:vue-six-four="getFileInfo" v-bind:allow-multiple="true">

The only difference is the event now return an array instead an object.

Build Setup

# install dependencies
npm install

# build component using poi
npm run component