vue.js - 从 vue-uploader 获取成功上传的文件列表
问题描述
我如何能够获取使用此 vue-uploader 组件成功上传的文件数组?
https://github.com/simple-uploader/vue-uploader
我想做这样的事情:
<template>
<uploader :options="options">
<uploader-unsupport></uploader-unsupport>
<uploader-drop>
<uploader-btn>Select files to upload...</uploader-btn>
</uploader-drop>
<uploader-list @successfully-uploaded-files="mySuccessfullyUploadedFiles"></uploader-list>
</uploader>
<pre>{{mySuccessfullyUploadedFiles}}</pre>
</template>
<script>
export default {
data () {
return {
mySuccessfullyUploadedFiles: [],
options: {
// https://github.com/simple-uploader/Uploader/tree/develop/samples/Node.js
target: '//localhost:3000/upload',
testChunks: false
},
attrs: {
accept: 'image/*'
}
}
}
}
</script>
解决方案
我想到了:
<template>
<uploader :options="options" @file-success="mySuccessfullyUploadedFiles.push($event)">
<uploader-unsupport></uploader-unsupport>
<uploader-drop>
<uploader-btn>Select files to upload...</uploader-btn>
</uploader-drop>
<uploader-list></uploader-list>
</uploader>
<pre>{{mySuccessfullyUploadedFiles}}</pre>
</template>
<script>
export default {
data () {
return {
mySuccessfullyUploadedFiles: [],
options: {
// https://github.com/simple-uploader/Uploader/tree/develop/samples/Node.js
target: '//localhost:3000/upload',
testChunks: false
},
attrs: {
accept: 'image/*'
}
}
}
}
</script>
推荐阅读
- php - cURL 错误 6:无法解析主机:test.example.localhost(参见 http://curl.haxx.se/libcurl/c/libcurl-errors.html)
- javascript - Vue2 - HTTP - 对对象值的访问返回未定义
- vue.js - 有自动导入动态组件的智能功能吗?
- html - 他们有什么方法可以实现只适用于 IE 的 css 代码吗?
- python - 熊猫将第二个最小值分配给列
- regex - 如何匹配所有重叠模式
- php - 如何在中回显 SESSION 变量
- jquery - 在 Select2 中选择多个值
- routing - 一个城市到两个地方的行驶距离的划分。
- node.js - 是否应该为所有请求使用单个 Mongoose 连接?或者每个请求都有不同的连接?