vue在使用ajax获取数据时,两种方法(jquery和vue_resource)
@{
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)的更多相关文章
- ajax获取值的两种方法
详细连接https://blog.csdn.net/a1102325298/article/details/80785143 ajax获得表单值的俩种方法 2018年06月23日 17:12:02 延 ...
- debug - vue中通过ajax获取数据时,如何避免绑定的数据中出现property of undefined错误
因为获取服务器是异步的,所以 vue 先绑定数据. 如果 ??? 是通过 ajax 异步获取的,在获取之前,???是未定义的.此时在外面的标签上添加一个 v-if="???" 可以 ...
- vue 中通过 ajax 获取数据时,如何避免绑定的数据中出现 property of undefined 错误
参考链接:https://segmentfault.com/q/1010000008264089?_ea=1597485
- ajax 请求数据的两种方法
实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写script 片段 这里我演示的是一个传递参数查询的例子 ...
- Ajax请求数据的两种方式
ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...
- vue 中使用 AJAX获取数据的方法
在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...
- php获取数组中重复数据的两种方法
分享下php获取数组中重复数据的两种方法. 1,利用php提供的函数,array_unique和array_diff_assoc来实现 <?php function FetchRepeatMem ...
- Java构造和解析Json数据的两种方法详解二
在www.json.org上公布了很多JAVA下的json构造和解析工具,其中org.json和json-lib比较简单,两者使用上差不多但还是有些区别.下面接着介绍用org.json构造和解析Jso ...
- Java构造和解析Json数据的两种方法详解二——org.json
转自:http://www.cnblogs.com/lanxuezaipiao/archive/2013/05/24/3096437.html 在www.json.org上公布了很多JAVA下的jso ...
随机推荐
- BZOJ2327: [HNOI2011]勾股定理
BZOJ2327: [HNOI2011]勾股定理 Description 题解Here! 这是一道神题... 我一开始把题目看错了,我以为是在$n$根木棒中选两个$i,j$满足$gcd(i,j)==1 ...
- git push & git pull 推送/拉取指定分支
https://blog.csdn.net/litianze99/article/details/52452521
- Spark高级
Spark源码分析: https://yq.aliyun.com/articles/28400?utm_campaign=wenzhang&utm_medium=article&utm ...
- Node安装及搭建简单HTTP服务器
注:本文安装系统为mac,windows及其他系统下载对应安装包 ,mac下载后的安装包为apk文件,windows为msi文件. 安装 1.在网上下载node安装包,官方网站2.双击下载文件,按步骤 ...
- hihocoder 1082 然而沼跃鱼早就看穿了一切 (替换指定的串 )
#1082 : 然而沼跃鱼早就看穿了一切 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 fjxmlhx每天都在被沼跃鱼刷屏,因此他急切的找到了你希望你写一个程序屏蔽所有句 ...
- perl字符集处理
本文内容适用于perl 5.8及其以上版本. perl internal form 在 Perl看来, 字符串只有两种形式. 一种是octets, 即8位序列, 也就是我们通常说的字节数组. 另一种u ...
- Android中的Handler,以及用Handler延迟执行
项目中遇到一个情况,先生成文件再上传:但有时候发出指令后上传会不成功,需要再发一次指令方能上传. 猜想是由于文件还没生成就执行「上传」指令了.想到要延时.Android中单纯用currentThrea ...
- Educational Codeforces Round 24 CF 818 A-G 补题
6月快要结束了 期末也过去大半了 马上就是大三狗了 取消了小学期后20周的学期真心长, 看着各种北方的学校都放假嗨皮了,我们这个在北回归线的学校,还在忍受酷暑. 过年的时候下定决心要拿块ACM的牌子, ...
- Android Studio 1.5.1
Android Studio 1.5.1 December 3rd, 2015: For information on what's new in 1.5.1, see the release ann ...
- Java多线程:线程状态以及wait(), notify(), notifyAll()
一. 线程状态类型1. 新建状态(New):新创建了一个线程对象.2. 就绪状态(Runnable):线程对象创建后,其他线程调用了该对象的start()方法.该状态的线程位于可运行线程池中,变得可运 ...