init 6.

V-Image 📷

• This is on GitHub so let me know if I've b0rked it somewhere, give me a star ⭐ if you like it 🍻
• Demo here -> v-image

✅ Install 👌

npm i v-image
// or 
yarn add v-image

✅ Usage 🎓

Register the component globally:

Vue.component('vImage', require('v-image'));

Or use locally

import vImage from 'v-image';

✅ Example 🍀

  <v-image alt="Alt Text for the Image" :name="'my-awesome-image'" :img-style="myStyle" @load-image="localVariable"></v-image>

import vImage from 'v-image';
export default {
  components: { vImage },
  methods: {
    localVariable(imageSentFromComponent) {
      this.image = imageSentFromComponent;
    },
  },
  data() {
    return {
      image: '',
      myStyle: {
        height: '200px',
        width: '200px',
      },
    };
  },
};

✅ 📖 Props:

Name	Type	Required?	Description
name	String	Yes	For name attribute for the input field.
alt	String	No	For alt attribute for the input field, mostly for proper SEO.
imgStyle	Object	No	Styling for the img tag.
buttonStyle	Object	No	Styling for the button & label tag.

✅ 👂 Events:

• load-image (load the base64 to your custom component's variable (see example)) [default: ""]

NPM