Sample Code for uploading images and files in vue, and sample code for vue

Sample Code for uploading images and files in vue, and sample code for vue

Html page

<Input type = "file" value = "" id = "file" @ change = 'onupload'> // note that brackets are not allowed.

Js Code

Methods: {// upload the image onUpload (e) {var formData = new FormData (); f ormData. append ('file', e.tar get. files [0]); formData. append ('type', 'test'); $. ajax ({url: '/ShopApi/util/upload. weixun ', // here the background interface needs to replace type: 'post', dataType: 'json', cache: false, data: formData, processData: false, contentType: false, success: (res) =>{ if (res. code = 200) {var img_tpl = '<div class = "picture" style = "width: pixel; float: left; ">  <span class =" r-span "onclick =" onDeletePicture () "style =" color: #49 BDCC; display: block; float: left; margin-left: 10px; line-height: 48px; "> Delete </span> </div> '; $ (" # refund_img "). after (img_tpl) ;}}, error: function (err) {alert ("network error ");}});}}

Image

The sample code for uploading images and files in the above vue is all the content shared by Alibaba Cloud xiaobian. I hope you can provide a reference and support for the customer's home.