做项目的时候遇到要用同步请求的情况,本来用的是jQuery封装好的同步请求,简单易懂易操作,如下:
```
funAndState (node) {
let obj = {
functions: [],
status: []
};
$.ajax({
url: '', // 请求路径
type: "post" ,
data: {nodeId: node},
async: false, // false为同步
success: function(res){
obj.functions = res.data.functions;
obj.status = res.data.status;
}
});
return obj;
}
```
但是要求是统一用axios请求,方便做拦截处理,所以使用方法就变成了下面这种:
```
async funAndState (node,callback) {
let obj = {
functions: [],
status: []
};
await axios.post('url',{nodeId: node}).then(res => {
obj.functions = res.data.data.functions;
obj.status = res.data.data.status;
callback(obj);
});
}
```
和jQuery相比,async + await 可以把异步请求变成同步,await必须搭配async使用。(据我的不严谨判断,await好像不能放在map等这类的表达式里,也不能放在其他异步比如this.setState里面)。另外,axios同步请求是不能直接和jQuery一样return出去的,不然return的永远是一个promise对象。所以要用callback回调函数来获取你要的返回值,使用如下(async + await一样是要的):
```
async submit () {
let funAndState;
await this.funAndState("01", function callback(res) {
funAndState = res;
});
console.log(funAndState);
}
```
- JS系列
- jQuery和axios的同步请求
- FormData和文件上传
- Http请求参数系列
- 面向对象:JS中的类与继承
- super关键字总结
- import和require语法的报错解决
- 常用的N个JS函数
- ES6新增的Set和Map
- 关于this的学习
- 人人都要会的防抖和节流
- AJAX的简单实现
- Vue
- nuxt
- 在nuxt中引入qrcode或者其他依赖包
- iVew
- 树形控件Tree的render函数
- 自定义组件:Upload封装
- React
- antd自适应高度表格
- 两个常用生命周期函数总结
- antd表格跨行处理(动态数据)
- antd中表单自定义验证踩坑
- Form+Upload实现文件上传全步骤
- 在react中实现Excel导出
- 表格嵌套和子表展开的处理
- 关于表格打印的一点思路
- Select组件中的模糊筛选
- echarts使用与总结
- echarts在react中的使用
- 简单的双层上下钻
- 复杂的多层上下钻(多次请求)
- 复杂的多层上下钻(单次请求)
- Git使用
- git基础一:安装git以及基本命令
- git基础二:add和commit
- 地图API
- 手动绘制点来实现驾车导航
- 地图自定义控件的使用
- 利用自定义标注实现头像展示
- 杂谈与总结
- 谈代码的可读性
- 简单总结判断代码质量的维度
- 3W模型看面向对象
