//vue裡面的HTML程式碼

<div id="modificationPreview">

        <input type="file" accept="image/*" @change="changeFile" id="modificationFile" value="" />

        <img :src="imageUrl" id="modificationImg">

</div>

//js程式碼

//圖片選擇預覽函式

preiverImage(file,imgId){

       let _this = this;

       let fileImg = file.files[0];

       // 確認選擇的檔案是圖片

       if(fileImg.type.indexOf("image") == 0) {

             let img = document.getElementById('imgId');

             let reader = new FileReader();

             reader.onload = function(evt){

                       _this.imageUrl = evt.target.result;

         }

     reader.readAsDataURL(file.files[0]);

     }else{

         alert('請選擇圖片上傳!');

     }

},

//函式呼叫

changeFile(){

     let imgaeId = document.getElementById('modificationImg');

     let fileId = document.getElementById('modificationFile');

     this. preiverImage(fileId,imgaeId)

},