Как заставить браузер загружать файл во Vuejs
Я Анамол Соман и веб-разработчик. Сегодня мы увидим, как принудительно загрузить файлы в vuejs с помощью Axios. На многих веб-сайтах мы видели этот тип функции, мы нажимаем на текст или блок, и в нашу систему загружается определенный файл, поэтому давайте посмотрим, как это работает.
Дизайн Скачать макет файла
На изображении выше мы видим, что есть несколько изображений, при щелчке по отдельной карточке изображение будет загружено. Обратите внимание на одну вещь, которую я использую здесь vuetify, вы можете использовать bootstrap-vue или что-то еще. Давайте сначала посмотрим код,
В приведенном выше коде у нас есть массив объектов filesrcs, в котором у нас есть два атрибута title, которые содержат имя файла и src, который содержит путь к этому файлу, при щелчке события карты запускает метод, который передает плитку файла и путь к файлу . посмотрим, что делает этот метод,
В методе downloadWithAxios () у нас есть вызов Axios, а затем в ответ на этот вызов мы вызвали другой метод forceFileDownload (), куда мы передаем ответ и заголовок этого файла. Вот и все, затем наш файл загружается, вы можете проверить его в загрузках вашего браузера
Заключение
Теперь мы можем загрузить любой тип файла, нам просто нужно передать заголовок и ссылку или путь к этому конкретному файлу. Если у вас есть вопросы, напишите мне в комментариях.
Спасибо
