vue.js - vue-simple-uploader 上传组件如何过滤掉文件夹？
用到了第三方上传组件 vue-simple-uploader，但是不需要支持文件夹上传，所以需要过滤掉文件夹，但是拖拽上传时是可以选择文件夹的，该如何过滤掉文件夹呢？
共有2个答案
要在 vue-simple-uploader 中过滤掉文件夹，可以通过监听 files-added 事件并手动过滤掉文件夹。我写了个示例代码，展示了如何实现这一点：
<template>
<div>
<uploader
ref="uploader"
:options="options"
@files-added="onFilesAdded"
>
<uploader-btn>选择文件</uploader-btn>
<uploader-drop>拖拽文件到这里</uploader-drop>
</uploader></div>
</template>
<script>
export default {
data() {
return {
options: {
target: 'your-upload-url',
// 其他配置项
},
};},
methods: {
onFilesAdded(files) {
// 过滤掉文件夹
const filteredFiles = files.filter(file => !file.webkitRelativePath);
this.$refs.uploader.addFiles(filteredFiles);
},},
};
</script>
在这个示例中，onFilesAdded 方法会在文件添加时被调用。我们通过 filter 方法过滤掉所有包含 webkitRelativePath 属性的文件，因为文件夹会包含这个属性.
这样，你就可以确保只有文件被添加到上传队列中，而文件夹会被过滤掉。
directory 设置为 false 呗，但是我看默认就是 false 哇。
UploaderBtn
点选上传文件按钮。
Props
directory {Boolean}
默认false, 是否是文件夹上传。single {Boolean}
默认false, 如果设为true，则代表一次只能选择一个文件。attrs {Object}
默认{}, 添加到 input 元素上的额外属性。
#directory - props - UploaderBtn - vue-uploader/README_zh-CN.md at master · simple-uploader/vue-uploader
-
介绍 用于将本地的图片或文件上传至服务器，并在上传过程中展示预览图和上传进度。目前 Uploader 组件不包含将文件上传至服务器的接口逻辑，该步骤需要自行实现。 引入 import { createApp } from 'vue'; import { Uploader } from 'vant'; const app = createApp(); app.use(Uploader); 代码演
-
swoole提供了文件上传模块，可以自动处理来自HTTP POST的文件上传。在Controller中调用 $this->upload->save('Upfile_key'); //需要生成缩略图 $this->upload->thumb_width = 136; //缩略图宽度 $this->upload->thumb_height = 136; //缩略图高度 $this->upload->t
-
问题内容： 我有一个像这样的数组： 现在，我想按某种条件过滤该数组，只保留值等于2的元素，并删除值不等于2的所有元素。 所以我的预期结果数组将是： 注意：我想保留原始数组中的键。 如何使用PHP做到这一点？有内置功能吗？ 问题答案：
-
import { Uploader } from 'feui'; components: { [Uploader.name]: Uploader } 基础用法 <fe-uploader :after-read="logContent"> <fe-icons type="camera" /> </fe-uploader> 设置input属性 <fe-uploader :af
-
可能的重复： 这个
-
已知一个vue文件的字符串，如何转换成组件呢？