如何在Laravel5中实现InfiniteScroll

Question

我找到了很多教程，但没有一个是有效的。在我的情况下，我有一个从googlefontapi返回的字体数组，我在页面中成功打印它 现在我只想要第一次加载10个字体，而其他人则滚动我的代码

public function index(){


    $url = "https://www.googleapis.com/webfonts/v1/webfonts?key=!";
    $result = json_decode(file_get_contents( $url ));
    $font_list = "";
    foreach ( $result->items as $font )
    {
        $font_list[] = [
            'font_name' => $font->family,
            'category' => $font->category,
            'variants' => implode(', ', $font->variants),
            // subsets
            // version
            // files
        ];
    }

    return view('website_settings')->with('data', $font_list);

}

视图文件

<div class="am-fonts">
      <ul class="am-fonts-list">

        @foreach($data as $fonts)
            <li class="abc">
                <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=<?php echo $fonts['font_name'];?>:<?php echo $fonts['variants'];?>">
                <div class="am-actions"><a href="{{url('/addFont', $fonts['font_name'])}}"><span><i class="icon add"></i></span></a></div>
                <div class="am-font-preview" style="font-family: <?php echo $fonts['font_name'];?>;">
                 <a href="#" class="details">Grumpy wizards make toxic brew for the evil Queen and Jack.</a>
                </div>
                <div class="am-font-details">
                    <div class="am-font-name">{!! $fonts['font_name'] !!}</div> 
                    <div>12 styles</div>
                </div>

            </li>
        @endforeach

      </ul>



    </div>