vue-update-表单形式复写方法上传图片

 handleSave() {
        const formData = new FormData();
        /* eslint-disable */
        for (let key in this.dataInfo) {
          if (Object.prototype.hasOwnProperty.call(this.dataInfo, key)) {
            formData.append(key, this.dataInfo[key]);
          }
        }
        let para = {
        			headers: {‘content-type‘: ‘multipart/form-data‘},
					style: "styleType",
				    path : "paths",
				    city : 1
					};
        this.$http.post(‘http://img.zeju.cn/zejuimg/img/upload‘, formData, para)
          .then((res) => {
            console.log(res);
          });
      },

  

<el-upload
	class="avatar-uploader"
       action=""
	:show-file-list="false"
	:on-success="handleAvatarSuccessLogoPc"
	:on-error="handleAvatarErrorLogoPc"
	:on-progress="handleProgressLogoPc"
	:before-upload="beforeUploadLogoPc"
	:http-request="handleSave">
	<img v-if="imageUrlLogoPc" :src="imageUrlLogoPc" class="avatar">
	<i v-else class="el-icon-plus avatar-uploader-icon" ref="plusIcon"></i>
	<p id="bottomPc" style="position: absolute;bottom: 0;background: rgba(0,0,0,.3);color:#fff;width: 100%;margin: 0;padding: 5px;">点击上传图片</p>
	<el-progress v-show="showFlagLogoPc" type="circle" :percentage="progressingLogoPc" :status="statusLogoPc" style="position: absolute;top:10%;left:15%;" ></el-progress>
</el-upload>

  

  

时间: 2024-08-05 19:36:27

vue-update-表单形式复写方法上传图片的相关文章

玩转web之json(五)---将表单通过serialize()方法获取的值转成json

form表单有一个serialize()方法,可以序列化表单的值,但是jquery提供的这个方法会把数据序列化为类似下面的形式: a=1&b=2&c=3&d=4 jquery并没有提供将表单数据序列化为json的方法,所以需要我们自己封装一下,下面给出代码和测试样例,先写一个js文件: $.ajaxSetup({ contentType: "application/x-www-form-urlencoded; charset=utf-8" }); var Dat

ios ASIHttpRequest库进行DELETE操作时delete带有参数表单的使用方法

1,普通的DELETE只需加上下述一句code: [request setRequestMethod:@"DELETE"]; 2,附带有参数表单的情况(一次删除请求): ASIFormDataRequest *request; NSURL *baseURL = [NSURL URLWithString:@"http://www.baidu.com/xx/"]; request = [ASIFormDataRequest requestWithURL:baseURL]

JavaScript表单序列化的方法详解

本文介绍下,在javascript中实现表单序列化的方法,通过实例加深理解,有需要的朋友参考下吧. 在JavaScript中,可以利用表单字段的type属性,连同name和value属性一起实现对表单的序列. 首先,我们来了解下在表单提交期间,浏览器是怎样将数据发送给服务器的.对表单字段的名称和值进行URL编码,使用和号(&)分割.不发送禁用的表单字段.只发送勾选的复选框和单选按钮.不发送type为"reset"和"button"的按钮.多选择框中的每个选中

不同编码页面之间表单的提交方法

关键词:编码 表单 GB2312 POST UTF8 使用accept-charset 属性 accept-charset 属性规定服务器处理表单数据所接受的字符集.accept-charset 属性允许您指定一系列字符集,服务器必须支持这些字符集,从而得以正确解释表单中的数据.该属性的值是用引号包含字符集名称列表.如果可接受字符集与用户所使用的字符即不相匹配的话,浏览器可以选择忽略表单或是将该表单区别对待.此属性的默认值是 "unknown",表示表单的字符集与包含表单的文档的字符集

vue的表单提交

vue的表单提交需要基于vue-resource <template> <div class="hello"> <form @submit.prevent="submit"> <div> 姓名:<input type="text" v-model="user.name"> </div> <div> 性別: <label> <i

改变表单的提交方法

在表单中添加如下代码: <input type="hidden" name="_method" value="DELETE"/> 如上面的代码,那么表单的提交方法就变为了DELETE了.

控制表单控件-修改表单的提交方法

代码: —————————————————————————— <script type="text/javascript">            //修改表单的提交方法            function modifyMethod(){                var f = document.forms[0];            //获取表单DOM                var method = f.myMethod.value;    //选择的

jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法

原始form表单值获取方式(手动): $.ajax({ type: "POST", url: "ajax.php", data: "Name=摘取天上星&position=IT技术", success: function(msg){alert(msg);}, error: function(error){alert(error);} }); JQ serialize()方法取值: $.ajax({ type: "POST&quo

vue的表单编辑删除,保存取消功能

过年回来第一篇博客,可能说的不是很清楚,而且心情可能也不是特别的high,虽然今天是元宵,我还在办公室11.30在加班,但就是想把写过的代码记下来,怕以后可能真的忘了.(心将塞未塞,欲塞未满) VUE+ElementUI 的表单编辑,删除,保存,取消功能 VUE的表单 <el-form :label-position="labelPosition" label-width="120px" :model="form" ref="fo