Задать вопрос
@lemonlimelike

Почему не загружается файл?

Почему не загружается файл? как сделать, чтоб он дошел до сервера?
Вот форма:
<form @submit.prevent="create" method="POST">
				<div class="form-el">
					<div class="form-box">
						<div class="margin">
							<label for="name">Имя</label>
							<div class="form-input">
								<input id="name" class="uk-input uk-width-1-2" type="text" v-model="name" placeholder="Имя">
							</div>
						</div>
						<div class="margin">
							<label for="keywords">Ключевые слова</label>
							<div class="form-input">
								<input id="keywords" class="uk-input uk-width-1-2" type="text" v-model="keywords" placeholder="Ключевые слова">
							</div>
						</div>
					</div>
				</div>
				<div class="from-el margin">
					<div uk-form-custom="target: true">
			            <input type="file" accept="image/*" @change="uploadImage($event)" id="file-input">
			            <input class="uk-input uk-form-width-medium" type="text" placeholder="Select file" disabled>
			            <img src="img/search.svg" alt="" style="background: #000;">
			        </div>
				</div>
				<div class="from-el margin">
					<button type="submit" class="uk-button uk-button-default">Добавить</button>
				</div>
			</form>


И вот два метода, которые отвечают за загрузку данных на сервер:
uploadImage($event) {

	            const URL = 'http://vue/crud/img/'; 

	            let data = new FormData();
	            data.append('name', 'my-picture');
	            data.append('file', $event.target.files[0]); 

	            let config = {
	              header : {
	                'Content-Type' : 'image/png'
	              }
	            };

	            return axios.post(
	              URL, 
	              data,
	              config
	            );
	            
        	},
        	create: function(){
                axios.post('/api/crud',{
                name: this.name,
                keywords: this.keywords,
                title: this.name
	            //Сохраняем изображение
	            })
	            .then(response => this.uploadImage())
	            .then(response => {
	               console.log(response);
	               location.href = '/crud';
	            }).catch(err =>{
	            	console.log(err.response);
	            });
            }
  • Вопрос задан
  • 52 просмотра
Подписаться 1 Простой Комментировать
Решения вопроса 1
Exploding
@Exploding
wtf?
<form action='/' method='post' enctype='multipart/form-data'>
...
</form>
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы