一个vue请求接口渲染页面的例子
new Vue({
el:'#bodylist',
data: {
list: [
{
"type_id": "1",
"type_name": "特色项目",
"program_list": [{
"check_program_id": "1",
"program_name": "HRA健康风险评估与疾病早筛",
"program_price": "440"
}, {
"check_program_id": "2",
"program_name": "血清胃功能检测",
"program_price": "187"
}, {
"check_program_id": "3",
"program_name": "视力快速筛查",
"program_price": "22"
}, {
"check_program_id": "4",
"program_name": "低剂量螺旋CT肺癌筛查",
"program_price": "260"
}]
} ]
},
methods: {
post: function (url, data) {
return new Promise(function(resolve, reject) {
$.ajax({
type: 'POST',
url: url,
data:{'action':'check_program_list','user_id':data},
success: function(res) {
resolve(res);
}
})
});
}
},
created () {
var _this= this;
this.post('http://***/api/check_program.php', '1').then(function(res){
var datas = $.parseJSON( res );
console.log(datas.data);
_this.list=datas.data;
});
}
});
}
一个vue请求接口渲染页面的例子


一个vue请求接口渲染页面的例子的更多相关文章
- 《React后台管理系统实战 :三》header组件:页面排版、天气请求接口及页面调用、时间格式化及使用定时器、退出函数
一.布局及排版 1.布局src/pages/admin/header/index.jsx import React,{Component} from 'react' import './header. ...
- 21 Flutter仿京东商城项目 商品详情 请求接口渲染数据 商品属性数据渲染
加群452892873 下载对应21可文件,运行方法,建好项目,直接替换lib目录,在往pubspec.yaml添加上一下扩展. cupertino_icons: ^0.1.2 flutter ...
- 动态生成简约MVC请求接口|抛弃一切注解减少重复劳动吧
背景 目前创建一个后端请求接口给别人提供服务,无论是使用SpringMVC方式注解,还是使用SpringCloud的Feign注解,都是需要填写好@RequestMap.@Controller.@Pa ...
- Electron-vue实战(二)— 请求Mock数据渲染页面
Electron-vue实战(二)— 请求Mock数据渲染页面 作者:狐狸家的鱼 本文链接 GitHub:sueRimn 一.环境搭建 1.安装Mock.js 如果仅仅用作脱离后台的模拟数据,就安装在 ...
- vue+vuex 修复数据更新页面没有渲染问题
不解: 为什么在关闭开关后,已经将data里的属性和vuex属性初始化后,页面就是不响应??? 问题: 由于切换路由后,获取到vuex的数据在created中赋值到data相对应的属性中,在关闭开关后 ...
- vue打包之后动态修改请求接口方法
1.可以根据自身情况封装获取配置文件接口信息 1.1我在static中新建一个config.json配置文件 { "DEV_URL":"/apis",//开发模 ...
- 从一个url输入浏览器到页面渲染出来,这个过程都发生了哪些事情?
经典问题:在浏览器输入一个url后,会发生什么事情呢? (1)假设是简单的http请求(GET),IPV4,无代理. 浏览器先查看浏览器缓存-系统缓存-路由器缓存,若缓存中有,请略过中间步骤,直接跳到 ...
- 从零开始,做一个NodeJS博客(四):服务器渲染页面与Pjax
标签: NodeJS 0 一个星期没更新了 = = 一直在忙着重构代码,以及解决重构后出现的各种bug 现在CSS也有一点了,是时候把遇到的各种坑盘点一下了 1 听歌排行 API 修复与重构 1.1 ...
- 用javascript向一个网页连接接口发送请求,并接收该接口返回的json串
一般前端与后端的互交都是通过json字符串来互交的,我的理解就是与网页接口的来回数据传递采用的数据结构就是json.一般是这样. 比如后端的代码是这样的: @RequestMapping(value ...
随机推荐
- Python 计数器
一.counter 1.counter是对字典类型的补充,用于追踪值的出现次数. import collections obj = collections.Counter('aabbccddee') ...
- U盘装机教程
http://winpe.uqidong.asia/upzxpxt/upzxpxt.html
- React Native之基于AsyncStorage的离线缓存框架设计
1.为什么要离线缓存? 宏观上来说: 提升用户体验: 我们要为用户提供流畅的APP操作体验,但我们无法保证所有用户的网络流畅度是好的,所以我们需要离线缓存来提升用户体验. 节省流量: 节省流量又分为两 ...
- 不一样的go语言之入门篇-Hello World
这是<不一样的go语言>的开篇之作,我尝试以java语言转变者的角度来聊一聊go语言.所以今天先从go语言的基础开始,即语法. 学习一门新的编程语言,必从语法开始.但需要注意的是, ...
- Java中递归和循环的优劣
介绍: 你用你手中的钥匙打开一扇门,结果去发现前方还有一扇门,紧接着你又用钥匙打开了这扇门,然后你又看到一扇门......但是当你开到一扇门时,发现前方是一堵墙无路可走了,你选择原路返回--这就是递归 ...
- ajax那些事儿
一.Ajax的定义浏览器与服务器之间,采用HTTP协议通信.用户在浏览器地址栏键入一个网址,或者通过网页表单向服务器提交内容,这时浏览器就会向服务器发出HTTP请求.Ajax全称Asynchronou ...
- JFreeChart 之柱状图
JFreeChart 之柱状图 一.JFreeChart 简介 JFreeChart是JAVA平台上的一个开放的图表绘制类库.它完全使用JAVA语言编写,是为applications, applets ...
- Postman使用记录
1. 情况: 当 本地需要测试,线上的项目也需要同时测试时,地址了输入还需要打开多个窗口,麻烦 点击圆圈部分 testForm是我新建的 输入请求的action名字 点击齿轮按钮: 地址栏填入方式: ...
- 解决angular页面值闪现问题
<body ng-app="ngAnimate"ng-cloak></body> <input type="checkbox" n ...
- MoreWindows 微软认证专家博客目录(白话算法,C++ STL,windows编程)
为了方便大家查找和学习,现将本人博客中所有博客文章列出目录. (http://blog.csdn.net/morewindows) 一. 白话经典算法 目前有17篇,分为七大排序和经典面试题 ...