laravel如何管理视图特定的JavaScript代码

时间:2016-12-08 11:07:02

标签: javascript php laravel blade

大家好,这是我的第一个问题。 我在如何使用laravel组织我的javascript时遇到了麻烦。 我有一些公共java脚本应该包含在每个页面,以及一些页面或视图特定的脚本。 我的方法现在是一个单独的包含文件,其中包含查看特定脚本的{if}语句,并将页面名称传递给视图以加载相应的脚本,它看起来像这样。

这是从网址获取网页名称的路由代码:

Route::get('project/{section?}', 'ProjectController@index');

这是控制器

class ProjectController extends Controller
    {
        //
        public function index($section = 'pitch')
        {
            $page = 'project';
            if ($section == 'pitch') {
                return view('pages.project.pitch', compact('page', 'section'));
            } elseif ($section == 'business_details') {
                return view('pages.project.businessDetails', compact('page', 'section'));
            } elseif ($section == 'marketing_sales') {
                return view('pages.project.marketingSales', compact('page', 'section'));
            } elseif ($section == 'staff') {
                return view('pages.project.staff', compact('page', 'section'));
            } else {
                return view('pages.project.pitch', compact('page', 'section'));
            }
        }
    }

这是我所包含的scripts.blade.php的示例{{not not code!}}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
        integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
        crossorigin="anonymous"></script>
@if(isset($page) && $page == 'explore')
    <script type="text/javascript"
            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATVGl-q2F19QoSxS-h1amZLEQ0hzTU3sQ"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
@elseif(isset($page) && $page == 'home')
@elseif(isset($page) && $page == 'project' && $section == 'pitch')
    <script src="/js/pie-chart.js"></script>
@elseif(isset($page) && $page == 'project' && $section == 'business_details')
    <script type="text/javascript"
            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATVGl-q2F19QoSxS-h1amZLEQ0hzTU3sQ"></script>
@elseif(isset($page) && $page == 'project' && $section == 'marketing_sales')
    <script src="/js/pie-chart.js"></script>

@elseif(isset($page) && $page == 'project' && $section == 'staff')
    <script src="https://cdn.rawgit.com/nnattawat/flip/master/dist/jquery.flip.min.js"></script>
@endif

这种方法令人筋疲力尽,感觉还有更好的,所以有吗? thanx提前帮助

2 个答案:

答案 0 :(得分:0)

我建议你的模板中只有javascript的部分,然后在每个视图中将代码放在部分中。 https://laravel.com/docs/5.3/blade#template-inheritance

答案 1 :(得分:0)

在您的脚本视图中:

@yield('js-import')

在你看来(探索例子)

@section('js-import')
    <script type="text/javascript"
            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATVGl-q2F19QoSxS-h1amZLEQ0hzTU3sQ"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
@endsection