Axios send request

--- What is axios:

Axios is a promise-based network request library for node.js and browsers.

First, the characteristics of axios:

1. Send an XMLHttpRequest request in the browser.

2. Requests can be sent in node.js

3. Support Promise API

4. Intercept request and response data


2. Axios request method:


3. Use axios

1. Install axios: npm install axios

2. Import axios in main.js

import axios from 'axios'  //安装完之后,导入axios

3. Set the global configuration to request the default root path

// 配置请求根路径
axios.defaults.baseURL = 'https://web.eylives.cn/api.svc'

4. Mount it in the vue instance and set it as a global property, and then send the request through this.$http call

// 挂在到Vue实例,后面可通过this.$http调用
Vue.prototype.$http = axios

Use this.$http.post() directly in the page to call the interface and send the request 

//在发送请求调用接口时,就可以直接写接口名
getNoticeList() {
            console.log(localStorage.getItem('userId'), localStorage.getItem('token'));
            let sendInfo = {
                id: localStorage.getItem('userId'),
                token: localStorage.getItem('token')
            }
            sendInfo = JSON.stringify(sendInfo)
            this.$http.post('getpropertynoticelist_wechat', sendInfo).then((res) => {
                console.log('链接成功', res);
                let resInfo = JSON.parse(res.data)
                console.log('后端获取数据', resInfo);
                let resDataList = resInfo.data
                console.log('返回数据列表', resDataList);
                this.noticeList = resDataList
                //简写一步到位
                // this.noticeList = JSON.parse(res.data).data
            }).catch((err) => {
                console.log('链接失败', err);
            })
        },

 4. Axios sends concurrent requests (sends two requests)

 

5. Axios common configuration items:

 Notice:

Get request to pass parameters with params: {}

If it is a get request, the request body is empty.

If it is a post request, the request body cannot be empty.

So in a post request , the request body corresponds to data: {}

 

 

 

 

 

Guess you like

Origin blog.csdn.net/G1best/article/details/126152959