@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
    @*支持ajax版本1.1.0以下的版本*@
    <script src="http://cdn.bootcss.com/vue-resource/1.1.0/vue-resource.min.js"></script>
</head>
<body>
    <div id="app">
        <table>
            <tr>
                <td>学号</td>
                <td>姓名</td>
                <td>班级</td>
            </tr>
            <tr v-for="item in Students">
                <td>{{item.ID}}</td>
                <td>{{item.Name}}</td>
                <td>{{item.Cls}}</td>
            </tr>
        </table>
    </div>
</body>
</html>

<script> 
    var app = new Vue({
        el: "#app",
        data: {        
            Students:""
        },

　　　//第一种:jquery ajax
        //beforeCreate: function () {
        //    var url = "/Home/Vue_Data";
        //    var _self = this;
        //    $.get(url, function (data) {
        //        _self.Students = JSON.parse(data);
        //    })
        //}

　　//第二种：vue_resource
        created:function(){
            var _self = this;

　　　　var url="/Home/Vue_Data";           
            _self.$http.get(url).then(function (data) {
                var json = data.body;              
                _self.Students = JSON.parse(json);
            });           
        }
    });
</script>

vue在使用ajax获取数据时，两种方法（jquery和vue_resource)的更多相关文章

  1. ajax获取值的两种方法

    详细连接https://blog.csdn.net/a1102325298/article/details/80785143 ajax获得表单值的俩种方法 2018年06月23日 17:12:02 延 ...

  2. debug - vue中通过ajax获取数据时,如何避免绑定的数据中出现property of undefined错误

    因为获取服务器是异步的,所以 vue 先绑定数据. 如果 ??? 是通过 ajax 异步获取的,在获取之前,???是未定义的.此时在外面的标签上添加一个 v-if="???" 可以 ...

  3. vue 中通过 ajax 获取数据时，如何避免绑定的数据中出现 property of undefined 错误

    参考链接:https://segmentfault.com/q/1010000008264089?_ea=1597485

  4. ajax 请求数据的两种方法

    实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写script 片段 这里我演示的是一个传递参数查询的例子 ...

  5. Ajax请求数据的两种方式

    ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...

  6. vue 中使用 AJAX获取数据的方法

    在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...

  7. php获取数组中重复数据的两种方法

    分享下php获取数组中重复数据的两种方法. 1,利用php提供的函数,array_unique和array_diff_assoc来实现 <?php function FetchRepeatMem ...

  8. Java构造和解析Json数据的两种方法详解二

    在www.json.org上公布了很多JAVA下的json构造和解析工具,其中org.json和json-lib比较简单,两者使用上差不多但还是有些区别.下面接着介绍用org.json构造和解析Jso ...

  9. Java构造和解析Json数据的两种方法详解二——org.json

    转自:http://www.cnblogs.com/lanxuezaipiao/archive/2013/05/24/3096437.html 在www.json.org上公布了很多JAVA下的jso ...

随机推荐

  1. node封装mysql模块

    node是基于异步的,因此在进行数据库查询操作的通常是通过回调来操作查询结果.但是在有了es7的async/await,基本不再需要回调了,所以本篇是基于async/await对mysql进行一次操作 ...

  2. delphi三层架构（使用SATRDA改造，客户端代码不变）

    我们的delphi程序很多是以前开发的,采用典型的CS架构,由程序直接连接数据库.现在需要改成在外网可以直接操作软件.先把数据库搬到了阿里云上,测试发现直接连数据库和VPN连接测试速度很慢,直连还容易 ...

  3. poj 1195 Mobile phones 解题报告

    题目链接:http://poj.org/problem?id=1195 题目意思:有一部 mobie phone 基站,它的面积被分成一个个小正方形(1 * 1 的大小),所有的小正方形的面积构成了一 ...

  4. 深入浅出Oracle学习笔记：Buffer Cache 和Shared pool

    Buffer cache 和 share pool 是sga中最重要最复杂的部分. 一.Buffer Cache 通常数据的读取.修改都是通过buffer cache 来完成的.buffer cach ...

  5. 使用TextView实现跑马灯的效果

    1.定义textView标签的4个属性: android:singleLine="true"//使其只能单行 android:ellipsize="marquee&quo ...

  6. 「NOI2004」「LuoguP1486」郁闷的出纳员

    Descrption OIER公司是一家大型专业化软件公司,有着数以万计的员工.作为一名出纳员,我的任务之一便是统计每位员工的工资.这本来是一份不错的工作,但是令人郁闷的是,我们的老板反复无常,经常调 ...

  7. Watir: 应用Watir-Webdriver 访问需要证书的网站情况

    #Suppose we will access an SVN net require 'watir-webdriver' b = Watir::Browser.new :chrome b.goto ' ...

  8. JAVA Synchronized （三） volatile 与 synchronized 的比较

    一,volatile关键字的可见性 要想理解volatile关键字,得先了解下JAVA的内存模型,Java内存模型的抽象示意图如下: 从图中可以看出: ①每个线程都有一个自己的本地内存空间--线程栈空 ...

  9. iOS copy/retain/assign

    1 深复制:内容拷贝,源对象和副本对象指的是两个不同的对象,源对象引用计数器不变,副本对象引用计数器为1 2 浅复制:指针拷贝,源对象和副本对象指的都是同一个对象,对象引用计数器+1,相当于retai ...

  10. 深入研究 Java Synchronize 和 Lock 的区别与用法

    在分布式开发中,锁是线程控制的重要途径.Java为此也提供了2种锁机制,synchronized和lock.做为Java爱好者,自然少不了对比一下这2种机制,也能从中学到些分布式开发需要注意的地方.  ...