<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. Java第三讲动手动脑

    1 以上代码无法通过编译主要是由于在Foo类中自定义了有参的构造函数,系统不在提供默认的构造函数(无参),而在上述的引用中并没有提供参数导致无法通过编译. 2. 运行结果 由运行结果分析可知,在运行时 ...

  2. 一个方便IO单元测试的C#扩展库

    对于我们.Net程序员,System.Web.Abstractions我们都非常熟悉,主要作用于Web可以实现单元测试,他是在.Net framework 3.5 sp1开始引入的,很好的解决项目表示 ...

  3. BUG: kernel NULL pointer dereference, address: 0000000000000008

    问题现象:有台实例是用于压测用的,只要是做TCP连接数压测时,连接数超过100多就会自动重启,各种日志里面看不到任何关于重启的报错 xxx云服务器供应商技术支持,后台工具检测到有panic迹象,但不确 ...

  4. Java定义一个方法处理公司的迟到问题的相关代码

    /** * 定义一个方法处理公司的迟到问题 * 1.输入迟到时间和月薪 * 2.处理逻辑: * 迟到1-10分钟,警告 * 迟到11-20分钟,罚款100 * 迟到21-30分钟,罚款200 * 迟到 ...

  5. 查找php-fpm

    [root@VM-4-6-centos /]# find / -name php-fpm/opt/remi/php74/root/usr/sbin/php-fpm/etc/opt/remi/php74 ...

  6. Lua中创建新的文件夹

    如下: os.execute('mkdir 文件夹名称')

  7. 关于精准UWB人员定位系统解决方案

    WB技术, 目前主要应用在室内定位.人员定位系统等定位领域.近年来被应用在无线定位和雷达测距应用中,因此作为民用雷达和民用测距取得了较快的发展.而今天,我们主要要来介绍的产品就是UWB技术的芯片DW1 ...

  8. 问题:为啥explain 后type=all

    最近在学习mysql 调优,学习explain执行计划,为了模拟出type=system或const,我创建了一张表test(id,name),id为主键,里面放了一条数据 执行 EXPLAIN SE ...

  9. Kubernetes--管理Pod对象的容器(3)

    共享节点的网络名称空间 同一个Pod对象的各容器均运行于一个独立的.隔离的Network名称空间中,共享同一个网络协议栈及相关的网络设备.也有一些特殊的Pod对象需要运行于所在节点的名称空间中,执行系 ...

  10. 理解redux中间件

    redux questions : 1. reducers 函数如何创建和聚合 2. action创建函数如何如何包裹在dispatch函数中 3. 如何给默认的dispatch方法增加中间件能力 m ...