VUE3 如何在事件里面下载本地文件不使用a标签

在Vue3中，你可以使用URL.createObjectURL方法和a标签的click事件来实现在事件里面下载本地文件，而不使用a标签。

首先，你需要在Vue组件中定义一个方法来处理下载文件的逻辑。在这个方法里面，你可以使用URL.createObjectURL方法来创建一个临时的URL，然后将这个URL赋值给一个a标签的href属性。接下来，你可以触发a标签的click事件来触发文件的下载。

下面是一个示例代码：

<template>
  <div>
    <button @click="downloadFile">下载文件</button>
  </div>
</template>

<script>
export default {
  methods: {
    downloadFile() {
      // 创建一个文件对象
      const file = new Blob(['Hello, World!'], { type: 'text/plain' });

      // 创建一个临时的URL
      const url = URL.createObjectURL(file);

      // 创建一个a标签
      const link = document.createElement('a');
      link.href = url;
      link.download = 'file.txt';

      // 触发a标签的click事件
      link.click();

      // 释放URL对象
      URL.revokeObjectURL(url);
    }
  }
}
</script>

在上面的代码中，当点击"下载文件"按钮时，会触发downloadFile方法。在这个方法里面，我们创建了一个文件对象，然后使用URL.createObjectURL方法创建了一个临时的URL。接着，我们创建了一个a标签，并设置了href属性为临时URL，download属性为文件名。最后，我们触发了a标签的click事件来触发文件的下载。在下载完成后，我们使用URL.revokeObjectURL方法释放了临时的URL对象。

请注意，URL.createObjectURL方法在某些浏览器中可能不可用，或者在某些情况下可能会出现内存泄漏问题。因此，在使用此方法时，请确保在下载完成后调用URL.revokeObjectURL方法释放URL对象。

希望能帮到你