laravel实现ajax分页,laravel自定义pagination实现ajax异步翻页

laravel实现翻页太简单了，几行代码就可以搞定，使用起来极其丝滑顺畅。但是由于laravel高度封装了翻页，要对其改造就显得比较尴尬了。

如有些场景下，我们需要异步翻页，看了laravel的文档，没找到相应的方法。如果要通过调用laravel关于翻页的相关方法，手工写一个分页，会很繁琐，对于这种操作，我是拒绝的。

既然可以通过修改样式改变分页，那么是不是可以通过js来修改分页的html代码，如：将分页a标签的href属性干掉，这样就不会进行跳转。接着截取分页的页码数字，再新增一个onclick事件，事件触发ajax请求，最后将服务器返回的数据替换现有分页。

逻辑上是可行的，撸起袖子就干吧...

blade视图代码：

{{ $data->render() }}

$('.ajax-page .pagination').find('a').each(function(e){

let page=$(this).attr('href').split('page=')[1];

$(this).removeAttr('href'); // 干掉href属性

$(this).attr("onclick", "AjaxPage(" + page + ")"); // 新增onclick事件

});

ajax异步请求函数：

let url = "{{ route('home.ajax-content') }}";

function AjaxPage(page) {

$.get(page:page}, function (data) {

$('div.content').html(data);

})

}

后端控制器方法:

public function ajaxContent(Request $request)

{

$data = Content::query()

->paginate(15);

return view('home.ajax_content', [

'data' => $data,

]);

}

ajax返回的数据可以是json，也可以是完整的html内容。前者需要在前端用js进行组装；后者需要新建一个ajax视图文件

综上，就能实现ajax分页了，虽然看下来这种实现方式有点怪，至少需要改动的代码并不多，适合懒人