vue2.js项目通过axios 发送get请求怎么写
时间: 2024-04-30 09:20:30 浏览: 8
在Vue2.js项目中通过axios发送get请求可以按照以下步骤进行:
1. 安装axios
在终端中运行以下命令安装axios:
```
npm install axios --save
```
2. 引入axios
在需要使用axios的组件中引入axios:
```javascript
import axios from 'axios'
```
3. 发送get请求
可以使用axios的get方法发送get请求,例如:
```javascript
axios.get('/api/data').then(response => {
console.log(response.data)
}).catch(error => {
console.log(error)
})
```
其中,`/api/data`是需要请求的接口地址。
4. 处理响应
在上面的代码中,使用了`then`和`catch`方法处理响应。`then`方法用于处理请求成功时的响应,`catch`方法用于处理请求失败时的响应。可以根据自己的实际需要进行处理。
5. 设置请求参数
可以使用axios的第二个参数来设置请求参数,例如:
```javascript
axios.get('/api/data', {
params: {
id: 1,
name: 'test'
}
}).then(response => {
console.log(response.data)
}).catch(error => {
console.log(error)
})
```
其中,`params`属性用于设置请求参数。这里设置了两个参数`id`和`name`。
6. 设置请求头
可以使用axios的第三个参数来设置请求头,例如:
```javascript
axios.get('/api/data', {
headers: {
'Authorization': 'Bearer ' + token
}
}).then(response => {
console.log(response.data)
}).catch(error => {
console.log(error)
})
```
其中,`headers`属性用于设置请求头。这里设置了一个`Authorization`头,值为`Bearer`加上token。