能否为Kendo Upload组件自定义文件浏览器并实现异步上传追加文件？

当然可以搞定！你碰到的FileList没法直接修改的问题是浏览器的安全限制——毕竟FileList是只读对象，确实没法硬往里塞文件，但Kendo Upload组件本身支持通过API手动触发文件选择和上传流程，完美适配你的自定义文件浏览器场景。

核心思路 #

不要试图操作原生input的FileList，而是直接通过Kendo Upload的实例方法，把自定义选择的文件注入到组件中，再触发上传事件。

具体实现步骤 #

1. 获取Kendo Upload实例
   先拿到你的Upload组件的实例，后续所有操作都基于它：

   const uploadWidget = $("#your-upload-component-id").data("kendoUpload");
   

2. 准备标准File对象
   如果你从自定义浏览器拿到的是Blob对象，需要先转换成标准的File实例（Kendo Upload只认标准File对象）：

   // 假设customBlob是你从自定义浏览器获取的Blob数据
   const targetFile = new File([customBlob], "desired-filename.ext", { 
       type: customBlob.type 
   });
   

   如果已经是File对象，这一步可以跳过。

3. 注入文件到Upload组件
   调用组件内部的_onSelect方法，模拟用户选择文件的行为，把你的自定义文件传进去：

   uploadWidget._onSelect({
       target: uploadWidget.element,
       files: [targetFile], // 支持数组，可传入多个文件
       preventDefault: () => {} // 模拟事件的preventDefault方法，避免默认行为冲突
   });
   

4. 触发上传（可选）
   如果你的Upload设置了autoUpload: false，可以手动触发上传：

   uploadWidget.upload();
   

完整示例代码 #

<!-- Kendo Upload组件 -->
<input id="custom-upload" name="upload-files" type="file" />
<!-- 自定义文件浏览器触发按钮 -->
<button id="pick-from-custom-browser">从自定义浏览器选文件</button>

<script>
// 初始化Kendo Upload
$("#custom-upload").kendoUpload({
    async: {
        saveUrl: "/your-upload-endpoint",
        removeUrl: "/your-remove-endpoint",
        autoUpload: false // 关闭自动上传，手动触发
    }
});

// 自定义选择按钮点击事件
$("#pick-from-custom-browser").on("click", function() {
    // 模拟从自定义文件浏览器获取的文件（实际场景替换成你的文件获取逻辑）
    const mockFile = new File(["自定义文件内容"], "my-custom-file.pdf", { 
        type: "application/pdf" 
    });

    const upload = $("#custom-upload").data("kendoUpload");
    
    // 注入文件到Upload组件
    upload._onSelect({
        target: upload.element,
        files: [mockFile],
        preventDefault: () => {}
    });

    // 立即触发上传
    upload.upload();
});
</script>

注意事项 #

• 确保传入的是标准File实例，Blob需要转换后再传入，否则Kendo Upload可能无法识别。
• 如果需要批量上传，只需要在files数组中传入多个File对象即可。
• 如果你需要自定义上传参数，可以在Upload的upload事件中修改表单数据，或者通过setOptions方法调整组件配置。

内容的提问来源于stack exchange，提问作者glowstarraw