vue中, request 函数,
时间: 2023-10-11 13:06:41 浏览: 56
在 Vue 中,通常使用 axios 库来进行网络请求。可以通过以下方式来创建一个 request 函数:
```javascript
import axios from 'axios'
const request = axios.create({
baseURL: 'http://api.example.com', // 设置请求的基础 URL
timeout: 5000 // 设置请求超时时间
})
export default request
```
这里使用了 axios 的 create 方法来创建一个 axios 实例,可以在实例中设置一些默认的请求配置,如基础 URL 和超时时间等。然后将该实例导出,便可以在其他地方使用。
使用该 request 函数,可以发起网络请求,例如:
```javascript
import request from './request'
request.get('/user?id=123')
.then(response => {
console.log(response.data)
})
.catch(error => {
console.error(error)
})
```
这里使用了 request 实例的 get 方法来发起一个 GET 请求,并将查询参数 id 设置为 123。在 then 方法中,可以获取到请求成功后返回的数据;在 catch 方法中,可以捕获请求失败的错误信息。
相关问题
vue中request.post
在Vue中,如果要使用POST方法发送请求,可以使用Axios库来处理。Axios是一个基于Promise的HTTP客户端,可以用于浏览器和Node.js平台。
首先,需要安装Axios库。可以使用npm或yarn来安装:
```bash
npm install axios
```
或
```bash
yarn add axios
```
然后在代码中引入Axios,并使用post方法发送请求。例如:
```javascript
import axios from 'axios';
axios.post('/api/login', {
username: 'example',
password: '123456'
})
.then(response => {
console.log(response);
})
.catch(error => {
console.log(error);
});
```
这里的`/api/login`是请求的URL,第二个参数是要发送的数据。在成功或失败后,分别会执行`.then()`和`.catch()`中的回调函数。
vue3 request
如果您想在 Vue3 中发起请求,可以使用内置的 `fetch` 函数或者第三方库 `axios`。下面是使用 `fetch` 函数发起 GET 请求的示例代码:
```javascript
fetch('https://jsonplaceholder.typicode.com/todos/1')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error))
```
如果您想发起 POST 请求,可以在 `fetch` 函数的第二个参数中传递一个配置对象,例如:
```javascript
fetch('https://jsonplaceholder.typicode.com/posts', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
title: 'foo',
body: 'bar',
userId: 1
})
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error))
```