request.js
Create a new folder network create request.js in the file
import axios from 'axios'
export function request (config) {
// 1 Create an axios instance
const intstance = axios.create({
baseURL: 'https://localhost:44314'.timeout: 5000
// contentType: 'application/json; charset=UTF-8',
// dataType: 'json'
})
// 1. Axios interceptor
intstance.interceptors.request.use(config= > {
return config
}, er= > {})
// 1. Axios responds to interception
intstance.interceptors.response.use(res= > {
return res
}, er= >{})return intstance(config)
}
export default request / / export
Copy the code
Main. Mount configuration
import request from '@/network/request'
new Vue({
el: '#app',
router,
store,
request, // Encapsulate axios
components: { App },
template: '<App/>'
})
Copy the code
Vue component call
Called in the VUE component that needs to use AXIOS
import request from '@/network/request'
request({ // Query all
url: '/api/Gj'
}).then(res= > {
this.tableData = res.data
})
request({ // Conditional query
url: '/api/Gjtype/' + gjtype
}).then(res= > {
this.tableData = res.data
})
request({ / / add
url: '/api/Gj'.method: 'POST'.data: {
'id': 0.'method': this.method,
'text': this.content,
'type': this.value
}
}).then(res= > {
console.log(res)
if (res.status === 201) {
this.open1()
console.log('success')}else {
this.open4()
console.log('failure')
}
}).catch(console.error.bind(console)) / / exception
request({/ / update
url: '/api/Gj/' + this.id,
method: 'put'.data: {
'id': this.newinfo.id,
'method': this.newinfo.method,
'text': this.newinfo.text,
'type': this.newinfo.type
}
}).then(res= > {
if (res.status === 204) {
this.open1()
console.log('success')}else {
this.open4()
console.log('failure')
}
}).catch(console.error.bind(console)) / / exception
Copy the code