vue如何实现一个按钮，点击下载csv文件

要实现一个按钮，点击下载csv文件，可以使用以下代码：

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

<script>
export default {
  methods: {
    downloadCSV() {
      const data = [
        ['姓名', '年龄', '性别'],
        ['张三', '18', '男'],
        ['李四', '20', '女'],
        ['王五', '22', '男']
      ];
      const csvContent = 'data:text/csv;charset=utf-8,' + data.map(row => row.join(',')).join('\n');
      const encodedUri = encodeURI(csvContent);
      const link = document.createElement('a');
      link.setAttribute('href', encodedUri);
      link.setAttribute('download', 'data.csv');
      document.body.appendChild(link);
      link.click();
    }
  }
}
</script>

这个代码中，我们在模板中定义了一个按钮，当用户点击这个按钮时，会触发 `downloadCSV` 方法。在这个方法中，我们定义了一个包含数据的数组 `data`，然后将这个数组转换成 CSV 格式的字符串。接着，我们使用 `encodeURI` 函数将这个字符串编码成 URI，然后创建一个 `<a>` 元素，将编码后的 URI 赋值给这个元素的 `href` 属性，并将 `download` 属性设置为 `data.csv`。最后，我们将这个元素添加到页面中，并模拟用户点击这个元素，从而触发文件下载。