Axios的基本使用

main.js文件中编辑

//导入axios
import axios from 'axios'
//添加到vue原型上，让所有vue组件都能通过this.$axios访问到axios
Vue.prototype.$axios = axios

所在路由请求

get-获取数据

//1.获取全部数据
this.$axios.get('http://localhost:3000/data').then(res=>{
	console.log(res)
})
//2.获取具体数据 （id为2的数据）方式1
this.$axios.get('http://localhost:3000/data/2').then(res=>{
	console.log(res)
})
//3.获取具体数据 （id为2的数据）方式2
this.$axios.get('http://localhost:3000/data',{
	headers:{},
	params:{
		id:2
	}
}).then(res=>{
	console.log(res)
})

post-添加数据

//添加 {name : stitch , age : 18}
this.$axios.post('http://localhost:3000/data',{
	name:'stitch',
	age: 18
}).then(res=>{
	console.log(res)
})

delete-删除数据

//删除 id为2的数据
this.$axios.delete('http://localhost:3000/data/2').then(res=>{
	console.log(res)
})

put/patch-修改数据

//修改id = 3 中的name数据为 angle
//put方式请求
this.$axios.put('http://localhost:3000/data/3',{
	name:'angle',
	age: 18
}).then(res=>{
	console.log(res)
})
//patch方式请求
this.$axios.patch('http://localhost:3000/data/3',{
	name:'angle'
}).then(res=>{
	console.log(res)
})