vue中的$http服务  需要引入一个叫vue-resource.js的文件，因为vue.js中没有$http服务。如果需要使用这个服务去百度下载vue-resource.js 然后引进项目即可。

还有一种方法是在开发项目中 需要，这样我们直接在npm 中下载  npm install vue-resource 即可 。然后在main.js中配置import VueResource from 'vue-resource';  然后用Vue.use(VueResource) 方法启用插件。

第一种get方法

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script src="js/vue.js"></script>

        <script src="js/vue-resource.js"></script>

    </head>

    <body>

        <div id="app">

            <input type="button" value="点击获取" @click="get()"/>

        </div>

        <script>

            new Vue({

                el:"#app",

                methods:{

                    get:function(){

                        this.$http.get('get.php',{

                            a:10,

                            b:1

                        }).then(function(res){

                            alert(res.data);

                        },function(res){

                            alert(res.status)

                        });

                    }

                }

            })

        </script>

    </body>

</html>

get.php文件：

<?php

$a=$_GET['a'];

$b=$_GET['b'];

echo $a-$b;

?>

get方法有两个参数get("PHP文件"，“参数”)

post方法：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script src="js/vue.js"></script>

        <script src="js/vue-resource.js"></script>

    </head>

    <body>

        <div id="app">

            <input type="button" value="点击获取" @click="get()"/>

        </div>

        <script>

            new Vue({

                el:"#app",

                methods:{

                    get:function(){

                        this.$http.post('post.php',{

                            a:2,

                            b:3

                        },{

                            emulateJSON:true

                        }).then(function(res){

                            alert(res.data);

                        },function(res){

                            alert(res.status)

                        });

                    }

                }

            })

        </script>

    </body>

</html>

post.php:

<?php

$a=$_POST['a'];

$b=$_POST['b'];

echo $a+$b;

?>

post方法有三个参数post("php文件"，"参数","emulateJSON:true")

emulateJSON:true 模拟一个JSON数据发送到服务器，这样才可以成功运行

转: https://blog.csdn.net/qq_36947128/article/details/72832977

vue $http请求服务的更多相关文章

  1. (转)ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法

    早上同事用PL/SQL连接虚拟机中的Oracle数据库,发现又报了"ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务"错误,帮其解决后,发现很多人遇到过这样的问 ...

  2. 关于Oracle报“ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务”错误

    关于Oracle报“ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务”错误原因:listener.ora中没有指定监听服务器名. 如下是解决思路: 尝试1.通过重启服务的方式启动数 ...

  3. tomcat7 ajax请求服务中文乱码

    在确保请求服务编码格式为utf-8的情况下,确保tomcat的配置 <Connector connectionTimeout="20000" port="8080& ...

  4. 【教程】【FLEX】#002 请求服务端数据（UrlLoader）

    为什么Flex需要请求服务端读取数据,而不是自己读取? Flex 是一门界面语言,主要是做界面展示的,它能实现很多绚丽的效果,这个是传统Web项目部能比的. 但是它对数据库和文件的读写 没有良好的支持 ...

  5. ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法

    今天用PL/SQL连接虚拟机中的Oracle数据库,发现报了“ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务”错误,也许你也遇到过,原因如下: oracle安装成功后,一直未停止 ...

  6. ***PHP请求服务curl以及json的解析

    对于thinkphp框架,相信每一个php开发者都会有了解或者熟悉吧!前端很多都用的ajax的结合,前几天遇到了一个问题,就是请求另一个服务,也就是请求一个接口,然后对方返回一个json串,一开始对c ...

  7. Angularjs总结（七） 路由及请求服务等

    define(['angular'], function (ng) { 'use strict'; var app = ng.module('index-module', ['ngCookies', ...

  8. 防止tab页重复的去请求服务端

    直接看图吧. 左边是企业树,右边是依据企业变化的一个tab页 实现功能:1.我们希望假设选中的企业不变,我们在切换旁边五个tab页的时候,仅仅是第一次进去的时候请求server端.以下来回切换tab页 ...

  9. 请求服务（RequestService）

    一个module中的web组件,负责将Service的结果按照适当的规范输出给前端.格式:http://server/moduleID/param0/param1/paramN/p.TYPE格式上包含 ...

  10. windows7 ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法

    用PL/SQL连接虚拟机中的Oracle数据库,发现又报了“ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务”错误,帮其解决后,发现很多人遇到过这样的问题,因此写着这里. 也许你没 ...

随机推荐

  1. 独立成分分析 与 功能连接之间的关联尝试 by 张高燕

    在处理fMRI数据时,使用空间ICA的方法.   将一个四维的fMRI数据分解为空间pattern与时间序列的乘积. //这里的pattern=component   其中每一pattern的时间序列 ...

  2. cocos2d-x v3.0新特性及使用

    八月份cocos2d-x官网发布了v3.0版本,这次更新的内容特别多,包括2dx的架构以及使用 总得来说,给开发者带来了很大的便利: 运行环境需求: Android 2.3 or newer iOS ...

  3. 5)Linux程序设计入门--信号处理

    )Linux程序设计入门--信号处理 Linux下的信号事件 前言:这一章我们讨论一下Linux下的信号处理函数. Linux下的信号处理函数: 信号的产生 信号的处理 其它信号函数 一个实例 .信号 ...

  4. OpenCV学习(8) 分水岭算法(2)

        现在我们看看OpenCV中如何使用分水岭算法.     首先我们打开一副图像:    // 打开另一幅图像   cv::Mat    image= cv::imread("../to ...

  5. MonoSingleton——Unity中的单例模式

    Unity中有很多特别的类需要以单例模式呈现,比如全局的UI管理类,各种缓存池,以及新手导航类等等.而Unity中,因为所有继承自Monobehaviour的脚本在实现的时候都是单线程的,所以像网上流 ...

  6. Android -- 使用主题配置文件，去掉程序启动界面的短暂黑屏

    关于黑屏 默认的情况下,程序启动时,会有一个黑屏的时期,原因是,首个activity会加载一些数据,比如初始化列表数据等. 去除步骤 1./res/values/styles.xml 在 Theme ...

  7. Git使用帮助

    1. 本地创建新项目 git init git add . git commit -m "First commit" 2. 本地代码同步Push到远程仓库 git remote a ...

  8. Eclipse启动Tomcat错误（其他类似）

    Eclipse启动Tomcat错误信息: Several ports (8080, 8009) required by Tomcat v6.0 Server at localhost are alre ...

  9. 解决 同时安装 python3,python2环境时，用pip安装 python3 包

    应用场景 默认mac上已经安装了 python2; 而我又安装了 python3,并使用 python3; 安装了 pip 默认,pip安装的包安装在了 python2上了: 但是我想用 pip把安装 ...

  10. 亲热接触Redis-第二天（Redis Sentinel）

    简单介绍 经过上次轻松搭建了一个Redis的环境并用Java代码调通后.这次我们要来看看Redis的一些坑以及Redis2.8以后带来的一个新的特性即支持高可用特性功能的Sentinel(哨兵). R ...