zhouchijian
/
fe-drone-ci
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix[UploadExcel]: fixed bug when there were multiple components(#1136) 

复用此组件时因为id不可重复的问题会导致onSuccess指向错误。
This commit is contained in:
zhaoguoweiLLHC 2018-09-27 13:24:37 +08:00 committed by 花裤衩
parent 98a8277a37
commit b82e8e860d
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/UploadExcel/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<input id="excel-upload-input" ref="excel-upload-input" type="file" accept=".xlsx, .xls" @change="handleClick"> <input ref="excel-upload-input" class="excel-upload-input" type="file" accept=".xlsx, .xls" @change="handleClick">
<div id="drop" @drop="handleDrop" @dragover="handleDragover" @dragenter="handleDragover"> <div class="drop" @drop="handleDrop" @dragover="handleDragover" @dragenter="handleDragover">
Drop excel file here or Drop excel file here or
<el-button :loading="loading" style="margin-left:16px;" size="mini" type="primary" @click="handleUpload">Browse</el-button> <el-button :loading="loading" style="margin-left:16px;" size="mini" type="primary" @click="handleUpload">Browse</el-button>
</div> </div>
@ -56,7 +56,7 @@ export default {
e.dataTransfer.dropEffect = 'copy' e.dataTransfer.dropEffect = 'copy'
}, },
handleUpload() { handleUpload() {
document.getElementById('excel-upload-input').click() this.$refs['excel-upload-input'].click()
}, },
handleClick(e) { handleClick(e) {
const files = e.target.files const files = e.target.files
@ -126,11 +126,11 @@ export default {
</script> </script>
<style scoped> <style scoped>
#excel-upload-input{ .excel-upload-input{
display: none; display: none;
z-index: -9999; z-index: -9999;
} }
#drop{ .drop{
border: 2px dashed #bbb; border: 2px dashed #bbb;
width: 600px; width: 600px;
height: 160px; height: 160px;