vue的学习之路（Axios 基本使用）
<script src="js/axios.min.js"></script>3、在页面中引用
4、发送异步请求
[*] url?xxx
[*] rest请求【GET,POST,DELETE,PATCH】
5、准备一个SpringBoot的控制层与axios进行交互
[*]实体类
public class User {
private Integer id;
private String username;
[*]控制层
/**
[*] @author 王恒杰
[*] @date 2021/12/16 16:25
[*] @Description:
*/
@Controller
@CrossOrigin //设置当前控制器支持所有域访问 解决跨域题目
public class UserAction {
@RequestMapping(“test1”)
@ResponseBody
public String test1(Integer id,String username){
System.out.println(“test1”);
System.out.println(“id:”+id);
System.out.println(“username:”+username);
return “test1 response”+id+username;
}
}
6、 GET方式的请求
axios.get(“http://localhost:8080/aa/test1?id=1&username=whj”)
.then(function (response) {
console.log(response.data)
})
.catch(function (err) {
console.log(err)
})
7、POST方式请求
[*]前台传的数据是json
//发送POST方式请求
axios.post(“http://localhost:8080/aa/test2”,{
id:2,
username:“王恒杰”
}).then(function (response) {
console.log(response.data);
}).catch(function (err) {
console.log(err)
})
[*]**注意： post接收数据时，必要在参数上添加 ** requestBody
https://img-blog.csdnimg.cn/img_convert/5ca4a23ac6e4e9ae06b19dfa5db6c476.png
8. axios并发请求
并发请求: 将多个请求在同一时间发送到后端服务接口,末了在集中处理惩罚每个请求的响应结果
function getUserAccount() {
return axios.get(‘/user/12345’);
}
function getUserPermissions() {
return axios.get(‘/user/12345/permissions’);
}
axios.all()
.then(axios.spread(function (acct, perms) {
// 两个请求如今都实行完成
}));
9.自定义配置对象发送请求
//自定义配置对象发送请求(创建实例 发送异步请求) 【企业开发必背】
var instaus = axios.create({
baseURL:“http://localhost:8080/aa/”,
// timeout: 5000 //设置响应超时时间 假如凌驾了5000秒报异常
});
instaus.get(“test1?id=3&username=yfj”)
.then(function (response) {
console.log(response.data);
})
.catch(function (err) {
console.log(err);
})
10、 拦截器
[*]作用：抽取共有代码 解决冗余题目，提升服从，提高程序的可维护性
axios中的拦截器：解决冗余题目
https://img-blog.csdnimg.cn/img_convert/a172b7b461547e49474dfa7f48bc7cc3.png
请求拦截器：发送请求时可以进行拦截，添加功能
响应拦截器：响应回来时进行拦截 添加功能
var instaus = axios.create({
baseURL:“http://localhost:8080/aa/”,
// timeout: 5000 //设置响应超时时间 假如凌驾了5000秒报异常
});
//添加请求拦截器
instaus.interceptors.request.use(function (config) {
总结
为了帮助各人更好温习重点知识、更高效的准备口试，特别整理了《前端工程师口试手册》电子稿文件。
内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。
包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司口试被问到的题目，涵盖了初中级前端技术点。
https://img-blog.csdnimg.cn/img_convert/d74f8b42f4a63c76b18efc6a818147df.png
https://img-blog.csdnimg.cn/img_convert/6deb905d9655a3f0f54b8920686e1970.png
前端口试题汇总
https://img-blog.csdnimg.cn/img_convert/42728594459506983a38ca2b86545fc6.png
JavaScript
https://img-blog.csdnimg.cn/img_convert/7796de226b373d068d8f5bef31e668ce.png
性能
https://img-blog.csdnimg.cn/img_convert/d7f6750332c78eb27cc606540cdce3b4.png
linux
https://img-blog.csdnimg.cn/img_convert/ed368cc25284edda453a4c6cb49916ef.png
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]