我需要使用vue js上传图片。
我插入图片的html代码是
<input type="file" id="wizard-picture">
我的 vue js 代码是..
<script>
submitBox = new Vue({
el: "#submitBox",
data: {
username: '',
picture: '',
},
methods: {
handelSubmit: function(e) {
var vm = this;
data = {};
data['username'] = this.username;
data['picture'] = this.picture;
$.ajax({
url: 'http://127.0.0.1:8000/api/add/post/',
data: data,
type: "POST",
dataType: 'json',
success: function(e) {
if (e.status)
{
alert("Registration Success")
window.location.href = "https://localhost/n2s/registersuccess.html";
}
else {
vm.response = e;
alert("Registration Failed")
}
}
});
return false;
}
},
});
</script>
我该怎么做才能实现同样的目标。这是我第一次做作品。我被困在同一个。任何人都可以帮助我获得结果吗?
最佳答案
你可以试试这个。只需创建一个新的 formData 对象并将名称和文件传递给它
改变你的输入
<input type="file" id="wizard-picture" @change="handleSubmit($event)">
以及你的方法:
methods: {
handleSubmit (e) {
let data = new FormData()
data.append('name', 'image')
data.append('file', e.target.files[0])
$.ajax({
url: 'http://127.0.0.1:8000/api/add/post/',
data: data,
type: 'POST',
success () {
}else{
}
})
}
}
关于javascript - 我怎样才能使用vue js上传图片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47810962/