<input id="file" type="file" name="name" @change="aaa"></input>

aaa(files){
var docFile=document.getElementById("file").files[0]//IE10以下不支持
console.log('files',docFile)

let formdata=new FormData()
  formdata.append('files',docFile)
this.axios.post(this.$API.AddFiles,formdata).then((res)=>{
console.log(res)
}).catch((err)=>{
console.log(err)
})
}

js简单的图片上传的更多相关文章

  1. UEditor之实现配置简单的图片上传示例

    UEditor之实现配置简单的图片上传示例 原创 2016年06月11日 18:27:31 开心一笑 下班后,阿华到楼下小超市买毛巾,刚买完出来,就遇到同一办公楼里另一家公司的阿菲,之前与她远远的有过 ...

  2. 一、简单的图片上传并预览功能input[file]

    一.简单的图片上传并预览功能input[file] <!DOCTYPE html> <html lang="en"> <head> <me ...

  3. 微信小程序简单封装图片上传组件

    微信小程序简单封装图片上传组件 希望自己 "day day up" -----小陶 我从哪里来 在写小程序的时候需要上传图片,个人觉得官方提供的 Uploader 组件不是太好用, ...

  4. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  5. 原生JS实现异步图片上传(预览)

    效果 实现过程分为两步 1. 用户点击添加后通过 H5文件读取 FileReader对象以DataURL的格式读取图片 2. 通过FormData对象生成表单数据,通过ajax上传到后台 HTML & ...

  6. 阿里云使用js 实现OSS图片上传、获取OSS图片列表、获取图片外网访问地址(读写权限私有、读写权限公共);

    详情请参考:https://help.aliyun.com/document_detail/32069.html?spm=a2c4g.11186623.6.763.ZgC59a 或者https://h ...

  7. 阿里云OSS图片上传plupload.js结合jq-weui 图片上传的插件

    项目中用到了oss上传,用的plupload,奈何样式上不敢恭维,特别是放在移动端上使用.于是自己把它移植到了jq weui的上传图片组件上. 更改:选择照片后确认即及时上传至oss服务器,不限制上传 ...

  8. js canvas压缩图片上传

    $('input[type="file"]').on('change',function(){ var files = !!this.files ? this.files : [] ...

  9. koa2实现简单的图片上传

    1.安装koa-body 2.引入koa-body const koa = require('koa'); const fs = require('fs'); const koaBody = requ ...

  10. 纯JS实现多图片上传(在layui框架中)

    HTML代码 <form id="form1" class="layui-form layui-form-pane" action="{:url ...

随机推荐

  1. 代码随想录-day1

    链表 今天主要是把链表专题刷完了,链表专题的题目不是很难,基本都是考察对链表的操作的理解. 在处理链表问题的时候,我们通常会引入一个哨兵节点(dummy),dummy节点指向原链表的头结点.这样,当我 ...

  2. 《HelloTester》第2期

    1.前言 饭前喝汤:如果你的月薪低于1万,不要总想着"新机会",而更加重要的是"练手艺".当你有了一定的手艺可以施展,机会自然存在! 读了之前的简历篇,我想你对 ...

  3. 如何免费获取高清动图并将其插入到Markdown中

    一.发现问题 我在做excel笔记的时候,想要动态展示操作excel的过程,由于我平时的笔记都是使用markdown记录,所以要在md文件中插入动图. 二.解决问题 细化问题 1.如何将动图插入到md ...

  4. swiper滑动异常

    遇到这样的情况,一共5张slide,但是从第三个起再往右划就不动了.后来发现是已经初始化swiper后又追加了slide.(大概意思是这样.太久的程序了,也不想仔细捋了) 暂且用到的办法: 先定义好: ...

  5. docker问题记录解决

    1.普通用户docker命令提示permission denied(权限问题) [user1@docker-1 root]$ docker imagesGot permission denied wh ...

  6. ssh操作

    # -*- coding: utf-8 -*-"""------------------------------------------------- File Name ...

  7. vue框架回顾

  8. 了解ASP(三) -- Cookie, Session, Application

    ASP一共内建了7个对象,有Session.Application.Cookie.Response.Request.Server,这些对象都可以直接使用. 1. 什么是 Cookie? 1. cook ...

  9. Java面向对象之抽象类abstract

    抽象类abstract 普通类 普通类可以直接产生实例化对象,并且在普通类之中可以包含有构造方法,普通方法.static 方法.常量.变量的内容. 所有的普通方法都会有一个"{}" ...

  10. 泛微OA技巧随记

    隐藏明细表的加号按钮,如果不想让用户手工添行,必须通过自动联动添明细行,可以将明细表的加号按钮隐藏. document.getElementById('$addbutton0$').style.dis ...