不多废话,笔记如下

1. javascript:

        let vm = new Vue({
el: '#card-text',
data: {
info: ''
},
beforeCreate: function () {
// 这个 _this 现在是指向 vue ,因为是vue调用了 beforeCreate()方法。
// 如果这里不保存,那么this将会在下面的 success() 方法中重置,重置之后是指向调用它的对象,也就是 ajax
let _this = this;
let url = "http://localhost:5000/api/Blog";
$.ajax({
url: url,
dataType: "json",
async: true,
//data:{"id":"value"},
type: "GET",
beforeSend: function () { },
success: function (req) {
// $(req).each(function (index, item) {
// let abstract = item.abstract;
// let createTime = item.createTime;
// $("#card-text").html(abstract);
// $("#card-time").html(createTime);
// });
_this.info = req;
},
complete: function () { },
error: function () { }
})
}
});

2. html:

<div class="row" id=card-text>

    <div class="col-md-4" v-for="item in info">
{{item.XXXX}}
</div> </div>

3. BTW:

1、函数名是一个指向函数的指针。

2、函数执行环境(this什么时候初始化):当某个函数第一次被调用时,会创建一个执行环境,并使用this/arguments和其他命名参数的值来初始化函数的活动对象。

3、初始化指向谁:在Javascript中,this关键字永远都指向函数(方法)的所有者。

Vue2.X 通过 ajax 获取 API 数据(非 axios)的更多相关文章

  1. ajax获取json数据及实现跨域请求

    最近想练习一下ajax获取json数据 , 首先上网找一些在线的可用来测试的接口. -----------------------------------------------------这里是接口 ...

  2. 用ajax获取后台数据,返回json数据,怎么在前台使用?

    用ajax获取后台数据,返回json数据,怎么在前台使用呢?后台 C# code   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == &qu ...

  3. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

  4. jquery autocomplete ajax获取动态数据,兼容各浏览器,支持中文

    jquery.autocomplete.js经过改动,支持各种浏览器.支持中文输入! 1.效果图例如以下 2.HTML和ajax代码 <!DOCTYPE html> <html xm ...

  5. JS-利用ajax获取json数据,并传入页面生成动态tab

    封装好的:ajax.js function ajax(url, fnSucc,fnFaild){ //1[创建] if(window.XMLHttpRequest){ var oAjax = new ...

  6. AngularJS学习笔记(3)——通过Ajax获取JSON数据

    通过Ajax获取JSON数据 以我之前写的与用户交互的动态清单列表为例,使用JSON前todo.html代码如下: <!DOCTYPE html> <html ng-app=&quo ...

  7. Ajax获取接口数据,url拼接参数跳转页面,js获取上一级页面参数给本页面

    1.Ajax获取接口数据 function demo(){ //假设请求参数 var requestBody = [{ "name":"zhang", &quo ...

  8. 十一、React 获取服务器数据: axios插件、 fetch-jsonp插件的使用

    react获取服务器APi接口的数据: react中没有提供专门的请求数据的模块.但是我们可以使用任何第三方请求数据模块实现请求数据 一.axios 获取Api数据 使用文档:https://www. ...

  9. Struts1.x下使用jquery的Ajax获取后台数据

        jquery中有多种Ajax方法来获取后台数据,我使用的是$.get()方法,具体的理论我不解释太多,要解释也是从别的地方copy过来的.下面就介绍我的项目中的实现方法.     前台页面: ...

随机推荐

  1. flask第三篇 request

    每个框架中都有处理请求的机制(request),但是每个框架的处理方式和机制是不同的 为了了解Flask的request中都有什么东西,首先我们要写一个前后端的交互 基于HTML + Flask 写一 ...

  2. 石川es6课程---6、解构赋值

    石川es6课程---6.解构赋值 一.总结 一句话总结: 结构相同一一对应的方式赋值:let [json, arr, num, str] = [{ a: 1, b: 2 }, [1, 2, 3], 8 ...

  3. linux中 ls |wc -l

      linux中 ls |wc -l_百度知道 答 205行,205个字,1920个字节,wc -l只输出文件行数

  4. ubuntu 18.04 64bit下如何安装安卓虚拟机anbox?

    一. 安装snapd sudo apt-get install snapd 二. 安装adb sudo apt-get install adb 三. 安装必要的内核模块 wget https://la ...

  5. stm8问题记录

    sprintf 错误 现象:打印不出来数字 需要包含#include<stdio.h>

  6. Android studio2 中的 SDK Manager的使用-------Android SDK 的安装与更新(Install missing platform(s) and sync project 编译错误解决)

    最近在编写Android程序,其中有一个问题就是对旧应用的导入,此时往往你的Android SDK中并没有老版本的Android SDK, 此时往往会提示你出现错误 Install missing p ...

  7. 《Structuring Machine Learning Projects》课堂笔记

    Lesson 3 Structuring Machine Learning Projects 这篇文章其实是 Coursera 上吴恩达老师的深度学习专业课程的第三门课程的课程笔记. 参考了其他人的笔 ...

  8. java源码-ReentrantLock源码分析-1

    ReentrantLock 继承于lock是比较常用的独占锁,接下来我们来分析一下ReentrantLock源码以及接口设计: Sync是ReentrantLock的内部静态抽象类继承Abstract ...

  9. //C#中的访问数据符

    [在命名空间里面直接定义类型只能用internal  或 public ] [要被同个解决方案内 其他项目访问 ,加引用 导命名空间]. [类的默认修饰符是internal] 1.Private    ...

  10. laravel 5.8 实现消息推送

    以下教程是基于5.6 的,在使用5.8实现时遇到一些问题,做一下记录 在我看来,实时通信才是 APP 应用的将来. Socket 服务通常不是那么容易实现,但是 Laravel Echo 服务改变了这 ...