layui作为前端开发开源框架之一,深受我的喜爱.但是出现了小小的问题解决下
问题背景
首先表明,新手上路。
这几天用python去写一下小的大作业挣点外快,接了一个小单。
初步设计思路,利用 f l a s k flask flask作为后端框架, l a y u i layui layui作为前端框架简单的完成异步交互
于时,就出现了问题, f l a s k flask flask是允许带参数进行 p o s t post post的,但由于觉得太复杂,就直接带 j s o n json json格式进行 p o s t post post,这时候相当于 l a y u i layui layui与 f l a s k flask flask进行交互,由于要直接携带 j s o n json json格式, l a y u i − t a b l e layui-table layui−table与 f l a s k flask flask进行交互时,需要增加异步请求 w h e r e where where关键字,携带 w h e r e where where关键字请求后便可以获取到数据,但此时就出现了分页失效的问题。
问题分析
网上真的是,稀里糊涂一片。
其实真实的主要原因还是因为 异步请求过慢导致和回调函数冲突了,以至于 l a y u i layui layui没有接收到数量等信息,就已经进行展示了。
问题解决
网上其他一些解决方案也是可以解决的,但是如果要从根源上解决问题,那就让其先获取到数据然后再进行分页。
所以就可以直接使用 a j a x ajax ajax向 f l a s k flask flask后端发送 j s o n json json格式数据,收到数据后,进行数据类型的转换( l a y u i layui layui需要 j s o n json json格式数据),此时,进行分页表格的生成即可。
代码展示
$.post('http://localhost:5000/search', JSON.stringify(message), function (datas) {
var option = {
elem: '#test',
limits: [10, 20, 25, 50, 100, 999999],
toolbar: '#tablebar1',
page: true,//开启分页
limit: 10,
cols: [[ //表头
, {field: 'id', title: 'ID', sort: true, fixed: 'left', width: '7%'}
, {field: 'name', title: '诗名', width: '13%'}
, {field: 'writer', title: '作者', width: '10%'}
, {field: 'content', title: '内容', width: '50%'}
, {field: 'href', title: '爬取链接', width: '20%'}
]]
}
datas = JSON.parse(datas);
option.data = datas;
table.render(option);
});
});