VUE文件上传

首先 上传图片的控件是

<input type="file" value=""  v-on:change="upLoad" />

然后定义一个上传图片的方法

upLoad(event) {
                //获取图片
                let file = event.target.files[0];
                //配置头部类型
                let fd = new FormData();
                fd.append("file", file);

                axios.post(/Info/UpLoad, fd).then(res => {
                    if (res.data.code > 0) {
                        this.proData.ImgUrl = res.data.fileName;
                        alert(上传成功)
                    } else {
                        alert(res.data.msg)
                    }
                })
            }

控制器要有一个对应的方法

//文件上传
        [HttpPost]
        public ActionResult UpLoad()
        {
            try
            {
                //一、获取前台传过来的文件
                var file = Request.Files[0];
                //将虚拟路径转成物理路径
                var imgDir = Server.MapPath("/Images/");

                //判断你要存储的文件夹是否存在,不存在创建
                //需要引用System.IO
                if (!Directory.Exists(imgDir))
                {
                    //创建文件夹
                    Directory.CreateDirectory(imgDir);
                }
                //保存
                file.SaveAs(imgDir + file.FileName);
                return Json(new {code = 1,fileName = file.FileName,msg="" }, JsonRequestBehavior.DenyGet);
            }
            catch (Exception ex)
            {
                return Json(new { code = 0, fileName = "", msg =ex.Message },JsonRequestBehavior.DenyGet);
            }
        }

 

 

VUE文件上传

上一篇:android 屏幕,语言,API版本 适配和兼容性


下一篇:微信公众号智能绑定功能实现(2014年10月24日 更新)