Question

有没有办法在加载子视图时将js加载到页面的<head>部分。我想只根据被调用的视图加载特定的JS文件。我正在使用刀片模板引擎。

Answer 1

使用节和模板继承可以更轻松地完成此操作。

首先，创建一个主布局文件，如下所示： http://paste.laravel.com/UY9我使用的是包括的 Initializr /引导。我将它存储在views / layouts / frontend / as中 master.blade.php用于前端和views / layouts / admin / as 管理员使用master.blade.php并根据需要进行修改。
你会注意到以@show结尾的各种@section声明。运用最后@show而不是@stop，允许你覆盖它们你的其他观点，你会注意到我添加了@section（'脚本'）宣言。因此，您可以创建如下视图：

    
@extends('layouts.frontend.master')

@section('scripts')
    Your Scripts
@stop

@section('content')
    Your content
@stop

就这么简单。这是非常强大的东西，因为它使您能够设置默认值，但如果需要也可以覆盖它，保持您的视图非常干净和最小化。

更好的方法是做到这一点：

    
@extends('layouts.frontend.master')

@section('head')
    @parent
    Your Scripts
@stop

@section('content')
    Your content
@stop

然后，您可以从主布局中删除@section（'scripts'）声明。使用@parent助手可以将内容附加到某个部分，从而在添加您在视图中指定的额外内容时保持默认值。

您还可以为@yield声明提供默认内容，例如@yield（'content'，'Default content'）。

查看http://codebright.daylerees.com/blade

Answer 2

首先制作一个通用的标题布局。

app/views/layouts/header.blade.php - header layout

<!DOCTYPE html>
<html>
<head>
  <title>{{ $page->title }}</title> {{-- Getting title from $page object, which is passed from route --}}
  {{ HTML::style('css/common.css') }}
  {{ HTML::script('js/jquery.js') }}
  {{ HTML::script('js/common.js') }}

然后页面特定的脚本布局。

app/views/layouts/script-about.blade.php - about-page script layout

{{ HTML::script('js/about.js') }}

然后查看特定页面。

app/views/about.blade.php - about page

@extends('layouts.master')
@section('content')
  <p>About-Us page content goes here</p>
@stop

然后是普通的页脚。

app/views/layouts/footer.blade.php - footer layout

  </body>
</html>

然后渲染主要布局。

app/views/layouts/master.blade.php - main layout

@include('layouts.header')
@include('layouts.script-'.$page->slug) {{-- Getting page name from $page object  --}}
</head>
<body>
  @yield('content')
@include('layouts.footer')

从路线中，您可以传递$page变量。你可能喜欢这条路线，

Route::get('{slug}', function($slug) {

    $page = Page::where('slug', '=', $slug)->first();
        // getting the datas from Page model with pages table where slug = last uri in your address-bar

    if ( is_null($page) ) { // if no page in db, call 404
        App::abort(404);
    }
        // render the view with page details
    return View::make($page->slug)->with(array('page' => $page));
});

Answer 3

在document

中所述的laravel 5.4中

您可以简单地使用堆栈（@stack和@push）从子视图（子视图）加载CSS和JS。

将@stack添加到您希望将JS文件或CSS文件从子视图添加到布局的布局中。

这里我将在布局文件中定义两个堆栈，一个用于CSS文件，另一个用于JS文件。我给第一个和第二个堆栈赋予实例styles和scripts

我们希望我们的CSS文件在布局文件

<head>
@stack('styles')
</head>

并且假设我们希望将我们的脚本添加到关闭正文标记中在布局文件中

@stack('scripts')
</body>

现在在子视图中我可以轻松添加像这样的CSS和JS文件

@push('styles')
<style rel="stylesheet" href="{{asset('dropzone/dist/min/dropzone.min.css') }}" ></style>
@endpush

@push('scripts')
<script src="{{ asset('dropzone/dist/min/dropzone.min.js') }}"></script>
@endpush

在laravel中加载子视图时加载js

3 个答案: