<input type="file" accept="image/*" @change="handleChange($event)" id="file-input">
<button v-on:click.prevent="handleSend">Отправить</button>
new Vue({
el: '#app',
data: {
name: 'John Doe',
keywords: 'key',
form: new FormData()
},
methods: {
handleSend: function () {
// upload image
axios.put(
'/upload',
this.form, {
header: {
'Content-Type': 'image/png'
}
}
).then(response => {
console.log('image upload response > ', response);
});
// send form
axios.post('/api/crud', {
name: this.name,
keywords: this.keywords,
title: this.name
}).then(response => {
console.log(response);
}).catch(error => {
console.log(error.response);
});
},
handleChange: function (event) {
this.form.append('name', 'my-picture');
this.form.append('file', event.target.files[0]);
},
}
});