在Laravel 5.2的特定视图上加载CSS和JS文件

loading CSS and JS files on specific views in Laravel 5.2

本文关键字:加载 CSS 文件 JS 视图 Laravel      更新时间:2023-09-26

我有CSS和JS文件,必须只加载在某些非常特定的视图在Laravel 5.2

我的老板决定放弃我们用来在刀片模板上加载JS文件的RequireJS。现在,我们正在尝试以本地方式加载依赖项。

这是我的代码:

@extends('layouts.app')
<link href="{{ URL::asset('assets/css/slick.grid.css') }}" rel="stylesheet">
<link href="{{ URL::asset('assets/css/examples.css') }}" rel="stylesheet">
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function() {
        loadscript('assets/js/jquery.event.drag-2.3.0.js');
        loadscript('assets/js/slick.rowselectionmodel.js');
        loadscript('assets/js/slick.core.js');
        loadscript('assets/js/slick.grid.js');
    });
</script>
@section('page')
//the rest of page

我的"loadscript"函数这样做:

function loadscript(url, callback)
{
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    head.appendChild(script);
};

这是工作,但感觉相当慢,我相信一定有一个更好的方法,有特定的css和js文件加载laravel在任何我们想要的视图

让css和js文件只在某些视图上加载是非常重要的。

Laravel 5 -仅在特定页面/控制器(特定页面的资产)上添加样式表

@extends('layouts.master')
@section('styles')
    <link href="{{asset('assets/css/custom-style.css')}}" />
@stop

如果您不喜欢@section()的想法,只想将动态脚本放在一个地方,请查看我的详细答案:

Laravel 5 -只在特定页面/控制器(特定页面的资产)上添加样式表

总之,使用命名路由:
<!-- In layout template -->
@if (in_array(Route::currentRouteName(), ['profile', 'register']))
    <script src="example.js"></script>
@endif