Vue.js同React、Angular,可以说号称前端三巨头。

前段时间，有个哥们说，Vue.js现在出2.0版本了。可是我现在还是在用1.0的。

Vue.js一直都没有好好系统的学习，包括目前公司虽然是在用Vue,但是让我感觉用的有些偏了。比如Vue.js明明就有异步交互，但是我用的却还是jQuery的ajax,说到这也不是歧视jQuery,只不过觉得没有用到刀刃上。总觉得怪怪的。

今天贴一段代码，关于Vue.js的Ajax请求，希望能给朋友们带来帮助。

下面代码，测试完全没问题，只不过url需要改成你个人项目或公司项目对应的那个。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Vue 测试实例</title>

<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>

<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>

</head>

<body>

<div id="box">

    <input type="button" @click="get()" value="点我异步获取数据(Get)">

</div>

<script type = "text/javascript">

window.onload = function(){

var vm = new Vue({

    el:'#box',

    data:{

        msg:'Hello World!',

    },

    methods:{

        get:function(){

            //发送get请求

            this.$http.get('localhost:8080/test-web/database/getAllDataBaseInfo').then(function(res){

                document.write(res.body);

            },function(){

                console.log('请求失败处理');

            });

        }

    }

});

}

</script>

</body>

</html>

Vue.js之Ajax请求的更多相关文章

  1. vue.js中ajax请求

    <div id="app"> <table style="border-collapse: collapse"> <thead&g ...

  2. vue.js遍历ajax请求的数据

    <div id="dv" style="text-align: center;"><div class="head input-gr ...

  3. leyou_04_vue.js的ajax请求方式

    1.异步查询数据,自然是通过ajax查询,大家首先想起的肯定是jQuery.但jQuery与MVVM的思想不吻合,而且ajax只是jQuery的一小部分.因此不可能为了发起ajax请求而去引用这么大的 ...

  4. Vue.js——基于$.ajax实现数据的跨域增删查改

    概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的.在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax ...

  5. Vue.js——基于$.ajax实现数据的跨域增删查改

    转自:https://www.cnblogs.com/keepfool/p/5648674.html 概述 之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是loc ...

  6. Vue.js使用-http请求

    Vue.js使用-ajax使用 1.为什么要使用ajax 前面的例子,使用的是本地模拟数据,通过ajax请求服务器数据. 2.使用jquery的ajax库示例 new Vue({ el: '#app' ...

  7. Atitit vue.js 把ajax数据 绑定到form表单

    Atitit vue.js 把ajax数据 绑定到form表单 1.1. 使用场景:主要应用在编辑与提交场合..1 1.2. 绑定数据到form控件,可以使用jquery,不过vue.js更加简单1 ...

  8. Atitit  项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx

    Atitit  项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx 1. 场景:应用在项目列表查询场景下1 1.1. 预计初步掌握vue ...

  9. vue.js的ajax和jsonp请求

    首先要声明使用ajax 在 router下边的 Index.js中 import VueResource from 'vue-resource'; Vue.use(VueResource); ajax ...

随机推荐

  1. RegexKitLite库的使用

    首先在官网:  http://regexkit.sourceforge.net/下载RegexKitLite.h和RegexKitLite.m两个文件 将其添加到工程目录下 取消自动引用计数ARC 手 ...

  2. 使用ActiveMQ实现JMS消息通信服务

    PTP(点对点的消息模型) 在点对点模型中,相当于两个人打电话,两个人独享一条通信线路.一方发送消息,一方接收消息. 在p2p的模型中,双方通过队列交流,一个队列只有一个生产者和一个消费者. 1.建立 ...

  3. 曹工说Spring Boot源码（5）-- 怎么从properties文件读取bean

    写在前面的话 相关背景及资源: 曹工说Spring Boot源码(1)-- Bean Definition到底是什么,附spring思维导图分享 曹工说Spring Boot源码(2)-- Bean ...

  4. CSA Lignts Out

    csa 算是热身题吧 如果是每次操作一行或一列,那么无论怎么操作,本质不同的行最多只有两种,本质不同的列也最多只有两种,那么只要把某一种行和某一种列全部翻转使得全为0即可 现在是同时操作一行一列,显然 ...

  5. 使用油猴子 greasemonkey xx 百度 ...

    百度首页在登录以后很恶心 没事弹出点垃圾新闻来污染眼球 搜索结果右下角的今日排行榜也是没事就出现垃圾的东西 所以让我们也xx一下百度.. // ==UserScript== // @name 清理百度 ...

  6. linux的安全--Selinux，tcp_wrappers，iptables使用

    一.linux安全 安全主要是端口与服务的对应配置 1.1 linux安全主要通过下面三个进行加固 Selinux----主要是对内核的访问权限加以控制 tcp_wrappers---一定程度上限制某 ...

  7. 关于&联系我

    本文已迁移至: Github博客:https://coco5666.github.io/blog/about Gitee博客:https://coco56.gitee.io/blog/about 博客 ...

  8. tf.get_variable函数的使用

    tf.get_variable(name,  shape, initializer): name就是变量的名称,shape是变量的维度,initializer是变量初始化的方式,初始化的方式有以下几种 ...

  9. Codeforces 990 调和级数路灯贪心暴力 DFS生成树两子树差调水 GCD树连通块暴力

    A 水题 /*Huyyt*/ #include<bits/stdc++.h> #define mem(a,b) memset(a,b,sizeof(a)) using namespace ...

  10. [易学易懂系列|rustlang语言|零基础|快速入门|（12）|Enums枚举]

    [易学易懂系列|rustlang语言|零基础|快速入门|(12)] 有意思的基础知识 Enums 今天我们来讲讲枚举. 在数学和计算机科学理论中,一个集的枚举是列出某些有穷序列集的所有成员的程序,或者 ...