var app = new Vue({

el: "#app",

data: {

name:"", // 商家名称

imageUrl:"", // 入门店图片

description:"", // 商家描述

address:"", // 商家地址

wifiName: "",

wifiPassword: "",

phone: "", // 联系方式

businessesLicence:"", // 营业执照

registerNum:"", // 请传入注册号

idCardBack: "",

idCardFront: "",

idCardHand: "",

provideInvoice:"", // 是否提供发票

businessTime:"", // 营业时间

},

mounted: function(){

},

methods: {

// 请问如果对下面的方法进行封装?(因为他们的逻辑都是一样的)

imageUrlUpload: function(e){

// 上传门店图片

var self = this;

var file = e.target.files[0];

if (!(file.type.indexOf('image')>-1)) {

alert('请选择图片格式');

self.imageUrl = "";

return;

}

var toekn = getCookie('access_token');

var fd = new FormData();

fd.append('file', e.target.files[0]);

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){

console.log(xhr.status);

if (xhr.status === 200 && xhr.readyState === 4) {

self.imageUrl = JSON.parse(xhr.responseText).data;

}

};

xhr.open('post', '/api/upload');

xhr.setRequestHeader("enctype", "multipart/form-data");

xhr.setRequestHeader("Authorization", "bearer "+toekn);

xhr.send(fd);

},

businessesLicenceUpload: function(){

// 上传营业执照

},

idCardFrontUpload: function(){

// 上传正面身份证

},

idCardBackUpload: function(){

// 上传反面身份证

},

idCardHandUpload: function(){

// 上传持证照

},

uploadimg: function(e, fields){

var self = this;

var file = e.target.files[0];

if (!(file.type.indexOf('image')>-1)) {

alert('请选择图片格式');

self.fields = ""; // 这里有问题 会去添加一个fields,而不是我想要的(修改self.xxx)

return;

}

var toekn = getCookie('access_token');

var fd = new FormData();

fd.append('file', e.target.files[0]);

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){

console.log(xhr);

if (xhr.status === 200 && xhr.readyState === 4) {

console.log(xhr);

// 修改data的时候,一般是`this.xx`,但是我使用的`fields`这种的,会去添加一个fields

self.fields = JSON.parse(xhr.responseText).data;

}

};

xhr.open('post', '/api/upload');

xhr.setRequestHeader("enctype", "multipart/form-data");

xhr.setRequestHeader("Authorization", "bearer "+toekn);

xhr.send(fd);

},

submit: function(){

alert(1);

}

}

});

之前的html调用时 ,

我想改成 ,

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐