Axios场景应用数据请求-基于Vue
Axios是什么：
理解：基于promise的Http库（轻量级），可以发送get、post请求
Axios特性：
- 可以在浏览器发送XMLHttpRequests
- 可以在node.js发送http请求
- 支持Promise API
- 拦截请求和响应
- 转换请求数据和响应数据
- 能够取消请求
- 自动转换JSON数据
- 客户端支持安全XSRF
Axios使用：
node安装
cnpm install --save axios
save依赖于生产环境，另一为开发环境
运行
nmp run dev
首页里添加方法
methods:{
getList(){
axios.get("http://127.0.0.1:7002/home/page/1/10").then(res=>{//url是本地的数据获取
console.log(res)//打印结果看看
})
}
不忘记在首页生命周期里调用上面方法
mounted.function(){
this.getList();
}
在main.js文件引入axios
-
import axios from 'axios'//其实不建议这种方法，方法看下一个 -
Vue.prototype.$http = axios//将axios存储在Vue的原型对象中，随意定义一个变量名存储 axios.defaults.baseURL = 'http://127.0.0.1:7002'//方便测试阶段，后续只需要改变端口
首页里改进方法
methods:{
getList(){
axios.$http.get("/home/page/1/10").then(res=>{//url是本地的数据获取
console.log(res)//打印结果看看
})
}
