前端如何操作文件夹 文件 写入??? #每天一个小知识

大家好，最近我发现了一个非常有趣的API，它是VS Code的在线版，我之前也用过，但忽略了一个功能，就是它可以打开最近的文件或文件夹。

实际上，浏览器现在可以读取目录和文件，甚至可以写入文件。我查看了MDN，发现有三个新的API，可以调用“show directory picker”方法。

这句话给大家提供了一个示例，是一个按钮加上了点击事件，点击时可以打开目录。返回的是一个Promise，可以直接调用。这是一个新的对象，可以通过回调函数获取它下面的所有目录。

点击“openHg”按钮，再次获取目录。调用完“getDirectories”方法后，点击“open”按钮，可以看到它确实可以获取目录。点击“choose folder”选项，查看文件，可以发现它返回的是一个“file system directive handle”对象，其中包含一个“module”属性，可以通过该属性获取其下面的所有目录。

调用“getDirectories”方法，然后再次点击“openHg”按钮，可以看到它返回了一个迭代器，可以使用“for of”语法快速迭代。注意，这是一个Promise，可以使用“for await”语法解决。

今天我们讲了迭代器的问题，可以使用“for of”语法解决。但是，我们返回的是一个Promise，该怎么办呢？注意，使用“for”循环时也可以使用“await”语法。因此，我们可以使用“for await”语法解决这个问题。

这样，我们既可以使用迭代器，又可以使用“for of”语法。接下来，我们来看一下“item”属性，然后刷新页面。

然后，我们可以查看目录中的文件或文件夹。注意，这里的文件或文件夹包括子目录。

例如，这是一个“file system directive handle”对象，其中包含一个“module”属性，可以通过该属性获取其下面的所有目录。

注意，这样我们就可以使用“for of”语法和“for await”语法了。最后，我们再看一下“item”属性，然后刷新页面。

这样，我们就可以获取目录中的文件或文件夹了。这个文件夹下面可能还有其他文件或文件夹。

如果遇到这种情况，可以使用“迭代器继续递规”的方法。可以将该方法写成“递规的方法”，这样就能顺序读取该目录下的所有文件了。

这个方法就是“获取目录”的用法，也就是“show directory picker”。

当然，它也可以获取文件。获取文件的方法很简单，只需使用“show open file picker”即可。通过该方法返回的是一个“promise”，可以获取单个或多个文件，并可以通过参数配置文件的详细信息。具体的配置信息可以参考MDN文档。

点击按钮后，会发现程序可以读取文件，并通过参数配置可以读取多个或单个文件。默认情况下，程序会读取单个文件，因此可以通过“中括号0”来读取文件的详细信息。

返回的对象仍然是“对象”。如果读取的文件是“minit”，则程序会返回“hand”，可以使用“getfilee”方法读取文件的详细信息。程序会返回一个“file对象”，这个对象与“input”的“file”对象类似。通过该方法读取的文件与输入的文件相似，程序会返回一个“promise”。

因此，需要等待程序完成后才能继续操作。程序会返回一个“file对象”，可以使用“filerender”或“blob”等方法来处理文件，并将文件发送给后台进行处理。

这是“读取文件”的方法，但也可以进行“写入文件”操作。使用“picker”返回的是一个“promise”，点击“open.write”按钮即可进行文件的写入。例如，可以使用“html”文件进行文件的写入，程序也会返回一个“promise”。如果文件写入失败，程序会返回一个“失败”状态。

以上是新增的三个API，具体信息可以在MDN文档中搜索。

以上就是本文的主要内容。