zl程序教程

您现在的位置是:首页 >  前端

当前栏目

ajax请求插件vue-resource的学习

VueAJAX学习插件 请求 resource
2023-09-27 14:29:06 时间

http://cn.vuejs.org/guide/plugins.html

ajax请求插件vue-resource的学习

https://github.com/vuejs/vue-resource/blob/master/README.md

1、安装

npm install vue-resource
   
   
  • 1
  • 1

2、使用

import VueResource from 'vue-resource';
Vue.use(VueResource);
   
   
  • 1
  • 2
  • 1
  • 2
this.$http.get("http://localhost/test.php").then(
            function (res) {
                // 处理成功的结果
                alert(res.body);
            },function (res) {
            // 处理失败的结果
            }
        );
   
   
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

传递数据到后端

this.$http.post("http://localhost/test.php",{name:"zhangsan"},{emulateJSON:true}).then(
            function (res) {
                // 处理成功的结果
                alert(res.body);
            },function (res) {
            // 处理失败的结果
            }
        );
   
   
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

3、test.PHP

<?php

// 指定允许其他域名访问
header('Access-Control-Allow-Origin:*');

// 响应类型
header('Access-Control-Allow-Methods:GET,POST,PUT');
header('Access-Control-Allow-Headers:x-requested-with,content-type');


var_export($_POST);

die('hello');
   
   
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13