一个页面能不能有多个axios
时间: 2023-11-10 09:33:26 浏览: 54
在一个页面中可以使用多个 `axios` 实例,每个实例可以有自己的配置和拦截器,在不同的场景下使用不同的 `axios` 实例可以更好地控制请求和响应的行为。
以下是一个使用多个 `axios` 实例的示例代码:
```javascript
// 引入 axios
import axios from "axios";
// 创建第一个 axios 实例
const axiosInstance1 = axios.create({
baseURL: "https://api.example.com",
timeout: 5000,
headers: {
"Content-Type": "application/json"
}
});
// 创建第二个 axios 实例
const axiosInstance2 = axios.create({
baseURL: "https://api.example2.com",
timeout: 5000,
headers: {
"Content-Type": "application/json"
}
});
// 使用第一个 axios 实例发送请求
axiosInstance1.get("/users").then(response => {
console.log(response.data);
}).catch(error => {
console.log(error);
});
// 使用第二个 axios 实例发送请求
axiosInstance2.post("/login", {
username: "example",
password: "password"
}).then(response => {
console.log(response.data);
}).catch(error => {
console.log(error);
});
```
在上面的代码中,我们通过 `axios.create()` 方法创建了两个不同的 `axios` 实例,它们分别对应不同的 API 服务器。在发送请求时,我们可以选择使用不同的 `axios` 实例,以满足不同的需求。