<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>axios.create()</title>
</head>
<body>
<!--
1). axios create(config)
a.根據指定配置創建一個新的 axios,也就是每個新 axios都有自己的配置
b.新 axios只是沒有取消請求和批量發請求的方法,其它所有語法都是一政的
c.為什么要設計這個語法?
需求:項目中有部分接口需要的配置與另一部分接口需要的配置不太一樣,如何處理
解決:創建2個新axios,每個都有自己特有的配置,分別應用到不同變求的接口請求中
-->
</body>
<script src="https://cdn.bootcss.com/axios/0.19.0/axios.min.js"></script>
<script>
//使用axios發請求
axios.defaults.baseURL = 'http://localhost:3000'
axios({
url: '/posts'
})
//-------------------------------------------------------------------------------
//創建一個新的axios
const instance = axios.create({
baseURL: 'http://localhost:3000'
});
//使用instance發請求
//方式一
instance({
url: '/posts'
})
//方式二
instance.get('/posts')
/*
那么問題來了,直接使用axios就可以發送請求了,我為什么還要再創建axios:
假如同一個項目,你要從不同的url地址來請求接口怎么辦?
url地址1:http://localhost:3000
url地址2:http://localhost:3002
url地址3:http://localhost:3003
這個時候你創建多個不同的axios,是不是就可以輕松解決。
*/
</script>
</html>
//創建 axios 函數對象 a.com b.com let one = axios.create({ baseURL: "http://localhost:8000", method: "GET", timeout: 2000, headers: { class: "H5200318" } }); one({ url:"/server" }).then(response => { console.log(response); }) one.get('/server').then(respones=>{ console.log(respones); }) // let two = axios.create({ // baseURL: "http://b.com:8000/server", // method: "GET", // timeout: 2000, // headers: { // class: "H5200318" // } // });
原文鏈接:https://blog.csdn.net/JEFF_luyiduan/java/article/details/103295801