vue-resource 实现 get, post

vue-resource 实现 get, post

1.除了 vue-resource 之外，还可以使用 axios 的第三方包实现实现数据的请求

vue-resource下载地址https://github.com/pagekit/vue-resource

npm

npm install vue-resource  

cdn

<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>

2.vue-resource 的配置步骤：

• 直接在页面中，通过script标签，引入 vue-resource 的脚本文件；

• 注意：引用的先后顺序是：先引用 Vue 的脚本文件，再引用 vue-resource 的脚本文件；

  3.发送get请求：

//				请求地址				请求数据		then(成功function,失败function)
this.$http.get('http://127.0.0.1:4000/?'+'username=123').then(function (result) {
    console.log(result.body)
    console.log('请求成功');
},function (err) {
    console.log('请求失败');
})

4.发送post请求：

postInfo() {
    var url = 'http://127.0.0.1:8899/api/post';
    // post 方法接收三个参数：
    // 参数1： 要请求的URL地址
    // 参数2： 要发送的数据对象
    // 参数3： 指定post提交的编码类型为 application/x-www-form-urlencoded
    this.$http.post(url, { name: 'zs' }, { emulateJSON: true }).then(function(data){
        console.log(data.body);
        console.log('post请求成功');
    },function(err){
        console.log('post请求失败');
    })
}

5.其他请求参照api

https://vue-resource.changwei.me/http请求与响应.html