[Vuejs]-How to set image to vue-picture-input from vue function

0👍

vue-picture-input has a prop named prefill. You can use the prefill to load a preload image. Inpite of using v-model here you need to bind the prefill prop with the imageURL. Look at the demo below.

<!DOCTYPE html>
<html>

<head>
  <script src="https://unpkg.com/vue"></script>
  <script src="https://unpkg.com/vue-picture-input"></script>
  <title>In the browser!</title>
</head>

<body>
  <div id="app">
    <p>{{ message }}</p>
    <picture-input width="200" 
  height="200" :prefill="imgURL"></picture-input>
  </div>
  <script>
    var app = new Vue({
      el: '#app',
      data: {
        message: 'Hello Vue!',
        imgURL: "https://picsum.photos/200/200",
      },
      components: {
        'picture-input': PictureInput
      }
    })
  </script>
</body>

</html>

Leave a comment