<el-upload
class="upload-demo"
action="/api_backend.php?r=groupcall-config/import-batch"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="1"
:on-success="success"
:on-exceed="handleExceed"
:data="uploadData">
<el-button type="primary" plain style="width: 120px;text-align: left;margin-left: 15px;"><i class="fa fa-upload">选择导入文件</i></el-button>
</el-upload>
//自定义请求
<el-upload class="upload-demo" drag action="123" :before-upload="beforeUpload"
multiple ref="newupload" :auto-upload="false" accept=".mp4,.flv,.mov" :on-
change="newhandleChange" :on-success="newhandlesuccess">
<i class="el-icon-upload"></i>
</el-upload>
<el-button type="primary" @click="newSubmitForm()" class="yes-btn">
确 定</el-button>
<el-button @click="resetForm('newform')">重 置</el-button>
//data为参数(post方式)
new Vue({
el: "#DataBase",
data: {
uploadData:{
id:""
},
},
methods: {
//上传
success(response,file,files){
if(response.statusCode!=1){
this.fileList = []
}
this.init()
this.$alert(response.message)
},
handleRemove(file,fileList){
console.log(file, fileList);
},
handlePreview(file){
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 1 个文件`);
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }?`);
},
handleSelectionChange(val) {
this.multipleSelection = val;
console.log(val)
},
handleSizeChange(val) {
this.page_size = val
this.init()
},
//自定义上传
beforeUpload (file) {
console.log(file)
let fd = new FormData()
fd.append('file', file)
fd.append('groupId', this.groupId)
// console.log(fd)
axios.post(url, fd, {
console.log(res)
})
return true
},
newSubmitForm () {
this.$refs.newupload.submit()
},
})
自定义请求,action写个任意的url,会出现404错误,然后设置auto-upload="false" ,这样就可以在方法中自定义请求方式
网友评论