axios之post提交
axios官网地址:https://github.com/axios/axios
post提交到后台需要做相对应的处理
使用URLSearchParams可以让post 数据提交到后台
对应gitHub上的内容如下:
In a browser, you can use the URLSearchParams API as follows:
const params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);
post提交之头像上传:
首先先阅读gitHub上axios关于头像上传的介绍
查看文件examples里面的upload 里面相对应有处理介绍
首先这有一个demo是简单的图片上传
<img :src="headImg" alt="">
<input type="file" id = "head" @change="uploadImg()">
// 图片上传
uploadImg(){
// console.log(document.getElementById('head').files[0]) 点取消输出undefined
if(document.getElementById('head').files[0]){
var data = new FormData();
data.append('headfile', document.getElementById('head').files[0]);
axios.post("输入上传接口地址",data).then(rest=>{
console.log(rest);
if(rest.data.code===200){
this.headImg = rest.data.data.msbox;
}
})
}
}
axios之post提交的更多相关文章
- element ui axios使用formdata提交数据
axios({ //formdata提交 headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, transformRequ ...
- vue+axios通过formdata提交参数和上传文件
demo.vue 文件 <template> <div class="demo"> <input v-model="importForm.m ...
- 【转】axios用post提交的数据格式
本文链接:https://blog.csdn.net/wopelo/article/details/78783442vue框架推荐使用axios来发送ajax请求,之前我还写过一篇博客来讲解如何在vu ...
- axios表单提交,delete,get请求(待完善)
import { mapMutations} from 'vuex' import axios from 'axios' const mixins = { data() { return { } }, ...
- axios+post方法提交formdata步骤详解
遇到的问题 :怎么看自己发送的格式和后台发送的格式 参考 http://www.php.cn/js-tutorial-396014.html https://blog.csdn.net/qq73705 ...
- axios封装get方法和post方法
我们常用的ajax请求方法有get.post.put等方法,相信小伙伴都不会陌生.axios对应的也有很多类似的方法,不清楚的可以看下文档.但是为了简化我们的代码,我们还是要对其进行一个简单的封装.下 ...
- vue中Axios的封装和API接口的管理
前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- vue.js学习之 跨域请求代理与axios传参
vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...
随机推荐
- 操作系统-文件系统(3)Linux目录配置
文件系统通常采用分层结构实现:文件管理.目录管理.磁盘管理 文件控制块(File Control Block,FCB)是操作系统为每个文件建立的唯一数据结构,包含了全部文件属性. 通常把FCB汇集.组 ...
- 四维dp,传纸条,方格取数
四维dp例题 四维dp便是维护4个状态的dp方式 拿题来说吧. 1. 洛谷P1004 方格取数 #include<iostream> #include<cstdio> usin ...
- springcloud高级
第一章 负载均衡 Ribbon (Spring Cloud 高级) 一. Ribbon 在微服务中的作用 1 什么是 Ribbon 1.Ribbon 是一个基于 Http 和 TCP ...
- LoadRunner回放脚本遇到的问题(遇到就补上)
问题一:Error-26612:HTTP Status-code=500(Internal Server Error) 解决过程:google找到了关于这个错误有多种解决的方法,但是都不是我要的,最重 ...
- PIoU Loss:倾斜目标检测专用损失函数,公开超难倾斜目标数据集Retail50K | ECCV 2020 Spotlight
论文提出从IoU指标延伸来的PIoU损失函数,能够有效地提高倾斜目标检测场景下的旋转角度预测和IoU效果,对anchor-based方法和anchor-free方法均适用.另外论文提供了Retail5 ...
- blazemeter和jmeter
前言 咸鱼的生活总是那么短暂,年轻还是要多学习 blazemeter BlazeMeter是一款可以记录所有HTTP流量并在10分钟内创建一个负载测试并且与Apache JMeter兼容的chrome ...
- 基础Html重点——防健忘
一.head标签重点 <head> <meta charset="utf-8"> <title>第二天课</title> <! ...
- ckeditor4.0以上使用行间距插件lineheight报错修改
①从百度上下载一个 ckeditor 行距包,解压放到ckeditor/plugins目录下. ②在config.js 中添加 config.extraPlugins += (config.extra ...
- Echars 参数说明
theme = { // 全图默认背景 // backgroundColor: 'rgba(0,0,0,0)', // 默认色板 color: ['#ff7f50','#87cefa','#da70d ...
- ThinkPHP6.0 判断是否有文件上传
有必要考虑不是post请求或没有指定enctype="multipart/form-data"的情况.如果是post请求还是设置了正确的编码,没有文件上传时 request()-& ...