Code js online

 https://codesandbox.io/

Javascript/ Vue package library

https://openbase.com/ 

Image preview in vue js

 <div id="app">

  <div class="container">

    <h1>Vue.js Image Preview</h1>

    <input type="file" @change="onFileChange" accept="image/*">

    <output>

      <img :src="previewUrl" v-if="previewUrl">

      <p v-else>No image...</p>

    </output>

  </div>

</div>

var app = new Vue({

  el: '#app',

  data: {

    previewUrl: ''

  },

  methods: {

    onFileChange: function (event) {

      const file = event.target.files[0]

      if (!file) {

        return false

      }

      if (!file.type.match('image.*')) {

        return false

      }

      const reader = new FileReader()

      const that = this

      reader.onload = function (e) {

        that.previewUrl = e.target.result

      }

      reader.readAsDataURL(file)

    }

  }

})