一个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 ...
随机推荐
- format 用法及对齐
空格填充: 元素填充(这里是2):
- scanf清除缓存区
为什么需要清除scanf缓存区呢?看一个例子: int main() { int a,b; scanf("%d",&a); scanf("%d",&am ...
- 使用metasploit做SNMP扫描和利用
使用MSF用于SNMP扫描 auxiliary/scanner/snmp/snmp_login 介绍 补充知识: 在执行SNMP扫描之前,需要了解几件事情.首先,“只读”和“读写”团体名(commun ...
- 无状态shiro认证组件(禁用默认session)
准备内容 简单的shiro无状态认证 无状态认证拦截器 import com.hjzgg.stateless.shiroSimpleWeb.Constants; import com.hjzgg.st ...
- linux manjaro 配置 pytorch gpu 环境
manjaro目前中国资料偏少,踩了很多坑. 安装gpu版本就这么几个步骤 1 安装英伟达的驱动cuda 2 安装 cudnn 3 安装支持gpu的pytorch 或者其他的运算框架 manja ...
- Web大前端面试题-Day12
1.前端需要注意哪些SEO? 合理的title.description.keywords: 搜索对着三项的权重逐个减小, title值强调重点即可, 重要关键词出现不要超过2次, 而且要靠前, 不同页 ...
- BZOJ.3425.[POI2013]Polarization(DP 多重背包 二进制优化)
BZOJ 洛谷 最小可到达点对数自然是把一条路径上的边不断反向,也就是黑白染色后都由黑点指向白点.这样答案就是\(n-1\). 最大可到达点对数,容易想到找一个点\(a\),然后将其子树分为两部分\( ...
- Wannafly挑战赛25游记
Wannafly挑战赛25游记 A - 因子 题目大意: 令\(x=n!(n\le10^{12})\),给定一大于\(1\)的正整数\(p(p\le10000)\)求一个\(k\)使得\(p^k|x\ ...
- 把url的参数解析出来
https://zhidao.baidu.com/question/455797151306205205.html
- angular2项目关于动画的处理
animations动画在angular2官网里面已经讲解很详细了,那么动画功能在实际项目中应该如何组织文件,动画文件放在哪个位置,如何来组织结构使得动画模块和其他模块之间运作调理清晰呢,下面参照Ni ...