1. Install AXIos and VUe-AXIos and QS (QS is to solve the problem that post uses X-www-from-urlencoded requests by default, so the request parameters cannot be passed to the background)

$ npm install --save axios vue-axios qs
Copy the code

2. Introduce Axios and QS in main.js

import axios from 'axios';
import qs from 'qs';
Copy the code

3. Configure QS to Axios in main.js

/ / HTTP request interceptor before some operating axios. Interceptors. Request. Use (config = > {the if (config. The method = = 'post') { config.data=qs.stringify(config.data); } return config}, error => {return promise.reject (error)});Copy the code

4. Use stereotype chain inheritance in main.js to add axios to VUE

Vue.prototype.$axios = axios;
Copy the code

5. The network requests get

var url ="/getProductInfo.do? userId=123"; this.$axios.get(url).then(res => {console.log(res)});Copy the code

6. The network requests post

var url ="/getProductInfo.do";
var data = { session, areaId };
this.$axios.post(url, data).then(res => {console.log(res)});
Copy the code

complete

F :(can see or not see)

<script> var that,axios; export default { data() { return { login_status : false }; }, mounted() { that=this; axios=this.$axios; this.getData(); // page list data}, methods:{getData(){axios.post('/login.do',{code:'123'}). Then (res=>{that. }}})Copy the code

Vue encapsulates the result returned by a network request into a variable

​
        _this.prototype.getJsSdkConfig= ()=>{
            var url = "/v1/api/getJsSdkConfig.do";
                   var data = { url:window.location.href};
                   _this.prototype.$axios
                       .post(url, data)
                       .then(res => {
                           return res;
                       })
                       .catch(error => {
                           return error;
             });
         };
 
​        var jsSdkConfig = _this.prototype.getJsSdkConfig();
        console.log(jsSdkConfig)
Copy the code