用ajax加载laravel视图

Question

我是 web 开发的新手。我在我的应用程序中使用 laravel，我使用刀片模板创建页面。我有一个主刀片，其中存在我的页眉和页脚，我将它用作包装器。我想要所有在不重新加载该基本模板的情况下打开其他页面，当我打开页面时，它会正确地使用新视图扩展主包装，但是当我用该页面的 ajax 内容更新该页面的内容时，可能是因为 @includes( ）在现有页面中创建一个新页面，但我想修复该双重内容和页脚。请帮助！这是我用来在主包装器中加载的页面代码

@extends('wrappertemplate')
@section('content')
<div class="body-content">`
And the content is here 
</div>
@stop

Answer 1

我会建议，除非这是一个非常简单的用例/游乐场练习，否则不要这样做，而是使用 Laravel 定义适当的 API，然后使用 React、Angular、Ember 等前端框架等与此 API 交互并处理 DOM 操作/创建。使用 Ajax 加载的 HTML 重新渲染整个页面似乎很奇怪。有很多关于使用 Laravel 和各种前端框架的教程

但是，根据您的要求，您需要首先创建一个扩展您拥有的 wrappertemplate 的页面。这应该在正文中没有任何内容的情况下加载

然后创建一个包含您想要的 html 的刀片文件 - 它不应该扩展任何内容。然后你就有了一个返回这个文件内容的路由和控制器方法。

那么你所要做的就是通过 ajax 获取 HTML 并将其附加到正文中。

这只是一个示例控制器：

class PageController extends Controller
{
    // This is your method which renders the page that is essentially a wrapper
    public function home()
    {
        return view('pages.home');
    }

    // This is your route which returns a partial, i.e. the content which gets refreshed
    public function content()
    {
        $html = view('partials.home-content')->with(['name'=>'ExoticChimp'])->render();

        return response->json(['html' => $html]);
    }
}

那么你的看法：

<!--pages.home-->
@extends('wrappertemplate')
@section('content')
<div class="body-content">`
And the content is here 
</div>
@stop

<!--partials.home-content-->
<h1>Hello {{$name}}</h1>

然后，您只需使用基本的 jquery 或 js 将 html 参数附加到您的正文内容的响应中。我也不打算写 JS，只是谷歌使用 jQuery 发出 AJAX 请求，并且有大量关于这些东西的文章。我必须强调，您应该考虑使用 Laravel + 前端框架。

教程：http://culttt.com/2015/04/06/getting-started-with-laravel-and-ember/

您应该阅读控制器的 Laravel 文档。 http://laravel.com/docs/5.1/controllers