ElementUi upload組件list-type:picture-card 編輯圖片回顯問題解決


一、問題分析:

  再使用 ElementUI 的 upload 組件進行上傳圖片的時候 點擊編輯發現圖片並不顯示 但是又想用他的那個卡片顯示 但是一直不知道回顯入口在哪 真的是急死小爺我了  

拖延症晚期患者 今天終於給他解決了

二、問題解決代碼(關鍵):

  

<el-upload
            style="display: inline-block"
            class="avatar-uploader"
            list-type="picture-card"
            :on-change = 'uploadChange'
            action=""
            :limit="1"
            accept=".jpg,.png,.jpeg,JPG,JPEG"
            :http-request="uploadImg"
            :file-list="fileList">
            <i class="el-icon-plus"></i>
        </el-upload>

  

this.showImg = this.img[0]
                let urlStr = this.showImg.split(","); 
                urlStr.forEach(item => {
                    let obj = new Object();
                    obj.url = item;
                    this.fileList.push(obj);
                });
//this.fileList是el-upload組件的file-list屬性直接把圖片push到這個數組就可以實現回顯了

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM