Как скачать локальный файл CSV с веб-страницы vue.js?

Question

Я новичок в vue.js, и мне в основном интересно, как можно, чтобы моя веб-страница отображала ссылку для загрузки файла CSV, который я хранил локально.

Я создал компонент Template.vue.Внутри него у меня есть

<a :href="item.loc" download>  {{item.title}} </a>

И в экспорте у меня есть это:

export default {
  name: 'Template',
  data () {
    return {
      item: {loc: require("../assets/example.csv")}
    }
  }
}

На данный момент это не работает для CSV-файлов.Я получил следующую ошибку при попытке запустить этот код с CSV-файлом:

"./ src / assets / example.csv Ошибка синтаксического анализа модуля: Неожиданный токен (1:14) Возможно, вам нужен соответствующийзагрузчик для обработки файлов этого типа. "

Однако, если я попытаюсь загрузить изображение (png), оно будет работать.Как мне реализовать загрузчик?Или есть другие способы решить мою проблему?

Answer 1

Вы используете vue-cli?Если вы это сделаете, я думаю, вы могли бы сделать что-то вроде

import csvFile from "../assets/example.csv"

export default {
  name: "Template",
  data() {
    return {
      item: csvFile
    }
  }
}

// in your template

<a :href="item"> <a/>

Если ваш CSV-файл не генерируется динамически, вы, вероятно, можете использовать его в качестве статического ресурса и просто связать его путь.Прошло много времени с тех пор, как я что-то сделал с Vue, но, посмотрев на документы, я думаю, вы можете поместить свой CSV-файл в статическую папку и ссылаться на него так:

<a href="./assets/example.csv">{{someTitle}}</a>

Ссылка на документы: https://cli.vuejs.org/guide/html-and-static-assets.html#disable-index-generation