vue element-ui 隱藏上傳按鈕

1、template：

<div style="text-align: initial;margin-top: 20px;">
　　<el-upload
　　　　　　:class="{hide:hideUpload}"
　　　　　　action= ''
　　　　　　list-type="picture-card"
　　　　　　:auto-upload="false"
　　　　　　:show-file-list='true'
　　　　　　:file-list="certificates"
　　　　　　:on-preview="showimg"
　　　　　　:on-change="handlePictureCardPreview"
　　　　　　:limit="3"
　　　　　　accept=".jpg,.jpeg,.png,.JPG,.JPEG"
　　　　　　:on-exceed="handleExceed"
　　　　　　:on-remove="handleRemove">
　　　　　　<i class="el-icon-plus" ></i>
　　　　</el-upload>
　　　　<el-dialog :visible.sync="dialogVisible">
　　　　<img width="100%" :src="showimgs" alt="">
　　</el-dialog>
 </div>

2、export default：

certificate: [],
certificates: [],
showimgs: '',
dialogVisible: false,
hideUpload: false,
limitCount: 3,

3、methods：

//放大顯示圖片
showimg(file) {
　　this.showimgs = file.url
　　this.dialogVisible = true
},
//限制圖片彈窗
handleExceed(files, fileList) {
　　this.$message.warning(`當前限制選擇 3 個文件，本次選擇了 ${files.length} 個文件，共選擇了 ${files.length + fileList.length} 個文件`);
},
//移除圖片
handleRemove(file, fileList) {
　　var that = this
　　that.certificate = []
　　fileList.forEach((item, index) => {
　　　　that.certificate.push(item.url);
　　});
　　//當圖片大於或等於3張，
　　this.hideUpload = fileList.length >= this.limitCount;
},
//選擇圖片
handlePictureCardPreview(file, fileList) {
　　var that = this
　　fileList.forEach((item, index) => {
　　　　if (item.raw) {
　　　　　　var reader = new FileReader()
　　　　　　reader.readAsDataURL(item.raw)
　　　　　　reader.onload = function () {
　　　　　　　　that.certificate.push(reader.result)
　　　　　　}
　　　　}
　　});
　　console.log(fileList.length);
　　if(fileList.length == 3) {
　　　　this.showBtnImg = false;
　　　　this.noneBtnImg = true;
　　}
　　this.hideUpload = fileList.length >= this.limitCount;
},

4、style：

.hide .el-upload--picture-card{
　　 display: none !important;   /* 上傳按鈕隱藏 */
}

需要注意的是，style 必須把 scope 移除掉，隱藏上傳按鈕才會生效！