使用vue下载选取文件夹功能

Vue本身不支持文件下载和选取文件夹的功能，但是可以通过第三方库来实现。以下是使用`file-saver`和`jszip`库实现文件下载和选取文件夹的示例代码：

安装依赖：

npm install file-saver jszip

代码：

<template>
  <div>
    <input type="file" ref="fileInput" style="display:none;" @change="selectFolder">
    <button @click="downloadFolder">Download Folder</button>
  </div>
</template>

<script>
import { saveAs } from 'file-saver'
import JSZip from 'jszip'

export default {
  methods: {
    // 选取文件夹
    selectFolder() {
      const folder = this.$refs.fileInput.files[0]
      console.log('Selected folder:', folder)
      // 可以将选取的文件夹上传到服务器或者直接下载文件夹
    },

    // 下载文件夹
    async downloadFolder() {
      const zip = new JSZip()
      // 添加文件到 zip
      zip.file('file1.txt', 'Hello World')
      zip.folder('folder1')
        .file('file2.txt', 'Hello Folder')
      // 生成 zip 文件
      const content = await zip.generateAsync({ type: 'blob' })
      // 下载 zip 文件
      saveAs(content, 'myFolder.zip')
    }
  }
}
</script>

在上述代码中，`selectFolder`方法通过`<input type="file">`元素选取文件夹，可将选取的文件夹上传到服务器或者直接下载文件夹。`downloadFolder`方法使用`JSZip`库生成一个 zip 文件，并使用`file-saver`库下载 zip 文件。