一、vue-resource
直接在页面中,通过script标签,引入vue-resource的脚本文件。 注意:引用的先后顺序 - 先引用Vue的脚本文件,再引用vue-resource的脚本文件。
<script src="../lib/vue-2.4.0.js"></script>
<script src="../lib/vue-resource-1.3.4.js"></script>
1. Get请求
this.$http.get(url), 参数:请求 的地址 返回一个promise对象
created(){
this.$http.get(this.baseUrl+'/weChat/applet/course/banner/list?number=5').then(res=>{
this.imgUrlList = res.data.data;
})
},
2. Post请求
this.$http.post(url,data,{ emulateJSON: true }) 第一个参数:请求 的地址 第二个参数:要发送的数据对象 第三个参数:指定post提交的编码类型 返回一个promise对象
created(){
this.$http.post(this.baseUrl+'/weChat/applet/course/list/type',{type:"free",pageSize:10,pageNum:1},{emulateJSON:true}).then(res=>{
this.courseList = res.data.rows;
})
},
二、axios
在页面用script标签引入脚本文件
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
1.Get请求
axios.get(url), 参数:请求 的地址 返回一个promise对象
created(){
axios.get(this.baseUrl+'/weChat/applet/course/banner/list?number=5').then(res=>{
this.imgUrlList = res.data.data;
})
},
2.Post请求
axios.post(url,form) 第一个参数:请求的地址 第二个参数:内置对象 内置对象有:FormData、URLSearchParams 返回一个promise对象
created(){
let formUrl = new URLSearchParams();
formUrl.append('type','free');
formUrl.append('pageSize',10);
formUrl.append('pageNum',1);
axios.post(this.baseUrl+'/weChat/applet/course/list/type',formUrl).then(res=>{
this.courseList = res.data.rows
})
},
|