vue+Element Ui 實(shí)現(xiàn)自動(dòng)上傳圖片

hufeng 發(fā)布于2019-08-26 12:20 / 626人閱讀

摘要：點(diǎn)擊上傳文件按鈕方法自動(dòng)上傳到多個(gè)圖片上傳文件上傳畫稿之前先判斷畫稿規(guī)格再插再到為了解決異步使用為了解決異步使用圖片名稱字符長(zhǎng)度超過不能上傳提示確定是異步的小牌不能上傳提示確定大牌不能上傳提示確定插入必須使用同步

點(diǎn)擊上傳文件按鈕 beforeAvatarUpload方法自動(dòng)上傳1到多個(gè)圖片


   上傳文件

**//上傳畫稿之前先判斷畫稿規(guī)格再插oracle 再post到php
//為了解決onload異步使用promise**

beforeAvatarUpload:function(file) {
    var _this = this;
    return new Promise(function(resolve, reject) { //為了解決onload異步使用promise
        if(file.name.length > 100){
            _this.$alert(file.name+"圖片名稱字符長(zhǎng)度超過100,不能上傳!", "提示", {confirmButtonText: "確定"});
            reject();
            return;
        }
        var reader = new FileReader();
        var img_oracleFlag = false;
        reader.onload = function(event) { //onload是異步的
            var image = new Image();
            image.onload = function () {
                var width = this.width;
                var height = this.height;
                if (width>height && vm.radio.GGH=="小牌"){
                    _this.$alert(file.name+"不能上傳!", "提示", {confirmButtonText: "確定"});
                    reject();
                    return;
                }else if (width

GPU云服務(wù)器云服務(wù)器 element-ui element-ui dialog組件實(shí)現(xiàn)圖片上傳 asp實(shí)現(xiàn)上傳圖片

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/108523.html

相關(guān)文章

Element-ui實(shí)現(xiàn)合并多圖上傳（一次請(qǐng)求多張圖片）

摘要：實(shí)現(xiàn)多圖上傳主要用到以下兩個(gè)屬性是自帶多圖上傳的，但是細(xì)心的朋友可能發(fā)現(xiàn)默認(rèn)多圖的實(shí)現(xiàn)可能和我們預(yù)期有些出入，有截圖可以看出，實(shí)質(zhì)是進(jìn)行多次請(qǐng)求在上傳事件觸發(fā)后，多圖上傳的默認(rèn)實(shí)現(xiàn)調(diào)用了三次請(qǐng)求。前言工作中碰到需要多圖上傳，在使用element-ui解決過程中碰到一些問題，在這里分享給大家。環(huán)境： Springboot+Vue+Element-ui 正文這次上傳使用的是Elem...

loostudy 2019-08-19 10:51 評(píng)論0 收藏0
前端小姿勢(shì)

摘要：文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完或者非最佳實(shí)踐僅供參考父子組件的參考官方文檔點(diǎn)我父級(jí)不需要操作額外代碼子代操作方法一這個(gè)的官方會(huì)有介紹子代操作方法二通過這個(gè)實(shí)現(xiàn)的看了不少文章，這種比較多以為例子先簡(jiǎn)單介紹文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完... 或者非最佳實(shí)踐僅供參考 1.父子組件的v-model 參考vue官方文檔...

JeOam 2019-08-02 16:11 評(píng)論0 收藏0
前端小姿勢(shì)

摘要：文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完或者非最佳實(shí)踐僅供參考父子組件的參考官方文檔點(diǎn)我父級(jí)不需要操作額外代碼子代操作方法一這個(gè)的官方會(huì)有介紹子代操作方法二通過這個(gè)實(shí)現(xiàn)的看了不少文章，這種比較多以為例子先簡(jiǎn)單介紹文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完... 或者非最佳實(shí)踐僅供參考 1.父子組件的v-model 參考vue官方文檔...

liaosilzu2007 2019-08-23 16:48 評(píng)論0 收藏0
前端小姿勢(shì)

摘要：文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完或者非最佳實(shí)踐僅供參考父子組件的參考官方文檔點(diǎn)我父級(jí)不需要操作額外代碼子代操作方法一這個(gè)的官方會(huì)有介紹子代操作方法二通過這個(gè)實(shí)現(xiàn)的看了不少文章，這種比較多以為例子先簡(jiǎn)單介紹文章包含學(xué)習(xí)中遇到的問題小白水平可能會(huì)包含一些錯(cuò)誤或者還沒寫完... 或者非最佳實(shí)踐僅供參考 1.父子組件的v-model 參考vue官方文檔...

LeexMuller 2019-08-29 18:31 評(píng)論0 收藏0
步步向前之Element-UI

摘要：無效方案根據(jù)交易所小時(shí)成交量占比和實(shí)時(shí)價(jià)格加權(quán)計(jì)算得到渲染結(jié)果是一個(gè)包含了文字，同時(shí)有名為的，并無小圖標(biāo)，后邊中括號(hào)結(jié)構(gòu)里只能有一個(gè)有待考證。 Table 固定表頭只要在el-table元素中定義了height屬性，即可實(shí)現(xiàn)固定表頭的表格，而不需要額外的代碼。例如： ... 這里文檔只給了一種固定高度250px的解決方案，實(shí)際應(yīng)用大多數(shù)是需要自適應(yīng)占滿父元素，超出滾動(dòng)固定表頭的...

Imfan 2019-08-02 11:51 評(píng)論0 收藏0