按照github中引入所需资源,想实现远程json数据的加载。
在浏览器中调试时可以看到,是能够加载到json数据的,但是无法渲染到前端页面中。
不知道是什么问题,坐等大神解答。
有没有跨域?
格式不对 要 是{total:11, rows:[{}]}
bootstrap-table 配置:
columns: [{
field: 'title',//这里的`title`对应从服务得到的数据中的字段就可以正确显示
title: '标题',
}, {
field: 'createdAt',//这里的`createdAt`对应从服务得到的数据中的字段就可以正确显示
title: '发布日期',
}, {
field: 'action',
title: '操作',
}],
从服务器获得的一部分数据如下(表格中只匹配了title
和createdAt
字段):
{
"content": "8月25日在接受澎湃新闻(www.thepaper.cn)独家专访时,面对网友质疑其学历造假一事,兰州交通大学博文学院院长陈玲边说边流泪,称自己确实是北京师范大学博士毕业生,也曾在北京大学做过访问学者,并拿出了北师大博士同等学力证书、北大国内访问学者证书等相关资料来证实。",
"categoryId": {
"__type": "Pointer",
"className": "ArticleCategory",
"objectId": "57c259c579bc440063dd3e05"
},
"title": "北师大:陈玲博士同等学力证无法核查,北大:确曾为访问学者 ",
"studioId": 1,
"objectId": "57c818460e3dd90063dd0216",
"createdAt": "2016-09-01T12:00:06.306Z",
"updatedAt": "2016-09-01T12:00:06.306Z"
},
如下图:
代码清单:
$('#article').bootstrapTable({
pagination : true,
striped : true, //设置为 true 会有隔行变色效果
responseHandler : function (res) { /*加载服务器数据之前的处理程序,可以用来格式化数据。 参数:res为从服务器请求到的数据。*/
console.log(res);
res.data.forEach(function (vo) {
const datetime = new Date(vo.createdAt).format('yyyy-MM-dd HH:mm:ss');
vo.createdAt = datetime;
vo.action = `<a href="{:U('Article/editArticle')}?id=${vo.objectId}">编辑</a> | <a href="#" onclick="del('${vo.objectId}')">删除</a> `
});
return res;
},
search : true,
searchAlign : 'left',
showHeader : true,
showColumns : true,
showRefresh : true,
showToggle : true,
showPaginationSwitch : true,
columns: [{
field: 'title',
title: '标题',
sortable : true,
align : 'center',
}, {
field: 'createdAt',
title: '发布日期',
sortable : true,
align : 'center',
}, {
field: 'action',
title: '操作',
align : 'center',
}],
url: '请求服务器数据地址',
});
{
"code": 200,
"data": [
{
"content": "8月25日在接受澎湃新闻(www.thepaper.cn)独家专访时,面对网友质疑其学历造假一事,兰州交通大学博文学院院长陈玲边说边流泪,称自己确实是北京师范大学博士毕业生,也曾在北京大学做过访问学者,并拿出了北师大博士同等学力证书、北大国内访问学者证书等相关资料来证实。",
"categoryId": {
"__type": "Pointer",
"className": "ArticleCategory",
"objectId": "57c259c579bc440063dd3e05"
},
"title": "北师大:陈玲博士同等学力证无法核查,北大:确曾为访问学者 ",
"studioId": 1,
"objectId": "57c818460e3dd90063dd0216",
"createdAt": "2016-09-01T12:00:06.306Z",
"updatedAt": "2016-09-01T12:00:06.306Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c81660a633bd006cfffb8d",
"createdAt": "2016-09-01T11:52:00.668Z",
"updatedAt": "2016-09-01T11:52:00.668Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c8165ea633bd006cfffb83",
"createdAt": "2016-09-01T11:51:58.332Z",
"updatedAt": "2016-09-01T11:51:58.332Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c81656165abd0068d60d14",
"createdAt": "2016-09-01T11:51:50.293Z",
"updatedAt": "2016-09-01T11:51:50.293Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c81653d342d30068d04114",
"createdAt": "2016-09-01T11:51:47.564Z",
"updatedAt": "2016-09-01T11:51:47.564Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c8164da633bd006cfffb18",
"createdAt": "2016-09-01T11:51:41.248Z",
"updatedAt": "2016-09-01T11:51:41.248Z"
},
{
"content": "Bootstrap Table",
"objectId": "57c8164379bc440063e9f1e8",
"createdAt": "2016-09-01T11:51:31.363Z",
"updatedAt": "2016-09-01T11:51:31.363Z"
},
{
"content": "Bootstrap Table",
"title": "Bootstrap Table",
"objectId": "57c8163dd342d30068d04085",
"createdAt": "2016-09-01T11:51:25.425Z",
"updatedAt": "2016-09-01T11:51:33.923Z"
},
{
"content": "Bootstrap Table",
"title": "Bootstrap Table",
"objectId": "57c816340a2b58006b1e0920",
"createdAt": "2016-09-01T11:51:16.536Z",
"updatedAt": "2016-09-01T11:51:21.197Z"
},
{
"content": "Bootstrap Table",
"title": "Bootstrap Table",
"objectId": "57c8162b6be3ff006a75b7fb",
"createdAt": "2016-09-01T11:51:07.515Z",
"updatedAt": "2016-09-01T11:51:18.601Z"
},
{
"content": "8月25日在接受澎湃新闻(www.thepaper.cn)独家专访时,面对网友质疑其学历造假一事,兰州交通大学博文学院院长陈玲边说边流泪,称自己确实是北京师范大学博士毕业生,也曾在北京大学做过访问学者,并拿出了北师大博士同等学力证书、北大国内访问学者证书等相关资料来证实。",
"categoryId": {
"__type": "Pointer",
"className": "ArticleCategory",
"objectId": "57c259c579bc440063dd3e05"
},
"title": "北师大:陈玲博士同等学力证无法核查,北大:确曾为访问学者 ",
"author": {
"__type": "Pointer",
"className": "_User",
"objectId": "57c4f6d65bbb5000634978e6"
},
"studioId": 1,
"objectId": "57c7f53bd342d30068cf2ea4",
"createdAt": "2016-09-01T09:30:35.458Z",
"updatedAt": "2016-09-01T10:54:11.366Z"
},
{
"content": "8月25日在接受澎湃新闻(www.thepaper.cn)独家专访时,面对网友质疑其学历造假一事,兰州交通大学博文学院院长陈玲边说边流泪,称自己确实是北京师范大学博士毕业生,也曾在北京大学做过访问学者,并拿出了北师大博士同等学力证书、北大国内访问学者证书等相关资料来证实。",
"categoryId": {
"__type": "Pointer",
"className": "ArticleCategory",
"objectId": "57c259c579bc440063dd3e05"
},
"title": "北师大:陈玲博士同等学力证无法核查,北大:确曾为访问学者 ",
"author": {
"__type": "Pointer",
"className": "_User",
"objectId": "57c4f6d65bbb5000634978e6"
},
"studioId": 1,
"objectId": "57c7f50ba633bd006cfee88d",
"createdAt": "2016-09-01T09:29:47.617Z",
"updatedAt": "2016-09-01T11:03:48.495Z"
},
{
"content": " 美国出版的《走路!不要跑步》一书中,作者史塔曼博士指出:行走健身要求迈大步,速度较快,双臂摆动,抬头挺胸。 不要以为健步行走就是简单的下肢运动。目前已有许多研究证实,规律的健走可有效锻炼身体各部位: 头脑——促使脑部释放内啡肽,使心情愉悦。 肺部——增加肺活量、降低嗜烟者对吸烟的渴望。 背部——加强背肌力量,且对背部伤害较小。 腿脚——行走相当于对骨骼进行力量训练,能明显增强腿脚骨骼和肌肉力量。 一周步行三个小时以上,就可以降低35%~40%的罹患心血管疾病风险。 一周三天,每次步行45分钟以上,可以预防老年痴呆。 一周步行7小时以上,可以降低20%的乳腺癌罹患率,对II型糖尿病有50%的疗效。 1.步行能增强心脏功能,使心脏慢而有力。 2.步行能增强血管弹性,减少血管破裂的可能性。 3.步行能增强肌肉力量,强健腿足、筋骨,并能使关节灵活,促进人体血液循环和新陈代谢。",
"categoryId": {
"__type": "Pointer",
"className": "ArticleCategory",
"objectId": "57c259c579bc440063dd3e05"
},
"title": "长期步行、健步行走,重塑你的健康人生",
"author": {
"__type": "Pointer",
"className": "_User",
"objectId": "57c4f6d65bbb5000634978e6"
},
"studioId": 3,
"objectId": "57c4f8036be3ff00584800ee",
"createdAt": "2016-08-30T03:05:39.004Z",
"updatedAt": "2016-09-01T10:59:19.517Z"
}
]
}