如何设置输入type="file"按钮的样式.

我正在使用node-webkit,我正在尝试让用户选择一个文件夹,然后我将返回该文件夹的目录结构并递归获取其子文件.

我用这个代码(在Angular Controller中)可以很简单地工作.

var fs = require('fs');

    $scope.explorer=[];
    $scope.openFile = function(){
            $scope.explorer = [tree_entry($scope.path)];    
            get_folder($scope.path, $scope.explorer[0].children);
    };

    function get_folder(path, tree){
        fs.readdir(path, function(err,files){
            if (err) return console.log(err);

            files.forEach( function (file,idx){
                tree.push(tree_entry(file));
                fs.lstat(path+'/'+file,function(err,stats){
                    if(err) return console.log(err);
                    if(stats.isDirectory()){
                        get_folder(path+'/'+file,tree[idx].children);
                    }
                });
            });
        });
        console.log($scope.explorer);

        return;
    }

    function tree_entry(entry){
        return { label : entry, children: []}
    }

使用具有22个子文件夹和大约4个级别的中等大小的文件夹,需要几分钟才能获得整个目录结构.

有什么东西我在这里显然做错了吗？我不敢相信这需要很长时间,因为我正在使用内置的Node fs方法.或者有没有办法获取目录的全部内容而不触及每个文件？

我希望能够在树的所有方向上对文件名使用Angular过滤器,也可能在内容上使用Angular过滤器,因此延迟处理整个树并不是一个可行的解决方案.

未捕获（承诺中）类型错误：window.showOpenFilePicker() 不是函数

我正在尝试阅读和写作，File System Web API但我不断发现TypeError Uncaught (in promise) TypeError: window.showOpenFilePicker is not a function，我不知道发生了什么。

这是反应代码片段：

const FileReader = () => {
    const openThisFile = async () => {
        const [fileHandle] = await window.showOpenFilePicker(); // error: Property 'showOpenFilePicker' does not exist on type 'Window & typeof globalThis'
        console.log(fileHandle);
    };
    return (
        <div>
            <button onClick={openThisFile}>Open file</button>
        </div>
    );
};

export default FileReader;

所以我认为它在 React 中不起作用，然后我尝试了 Vanilla Javascript，但我仍然不断进入TypeError Uncaught (in promise) TypeError: window.showOpenFilePicker is not a function …

你好，

我在 javascript 中有一个变量列表，我想用给定目录的文件列表自动填充。这是文件列表：

hello.mp3
gasp.mp3
scream.mp3
...

变量将如下所示：

var sounds = {
  "hello" : {
    url : "sound/hello.mp3"
  },
  "gasp" : {
    url : "sound/gasp.mp3",
  },
  "scream" : {
    url : "sound/scream.mp3",
  }
};

问题是我不能使用 PHP，因为我的服务器不支持它，我不能改变它。这是在客户端，所以我想用 javascript 来做也是不可能的。我有什么选择来实现这一目标？

虽然这里的用例并不那么重要，但实际上的用途很重要。我想像我们一样通过浏览器浏览用户本地文件系统，<input type="file">但我不想选择一个文件，而是选择一个目录并获取其中所有文件和目录的列表。

一旦获得文件列表，我想以树状视图结构递归地显示它们。

这是我知道可以通过File System Access Api完成的示例。

我只想使用这个 API 来创建文件管理器或树视图之类的东西。

谢谢。