文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >如何使用laravel 5.4.6在主模板中渲染多个动态部分/包含/收益

问如何使用laravel 5.4.6在主模板中渲染多个动态部分/包含/收益
EN

Stack Overflow用户
提问于 2017-02-12 12:30:40
回答 2查看 1.7K关注 0票数 0

我是第一次接触laravel，正在从事我在laravel 5.4.6中的第一个项目。我有一个问题，那就是如何将多个动态部分/包含/产出内容呈现到主模板中。我已经使用了@section('content')，但还需要更多的节(包含来自数据库的动态数据)来显示在我的布局页面上。以下是我的问题详细信息：

1-路由

代码语言：javascript
复制
   Route::group(['middleware' => ['web']], function () {
   Route::get('/', 'HomeController@showIndex'); 
   Route::get('/index', 'HomeController@showIndex');});

2- master.blade.php

代码语言：javascript
复制
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8" />
        <title>@yield('title')-Al Quraish Publications</title>
        <meta name="keywords" content="" />
        <meta name="description" content="" />
        <meta name="Author" content="" />

        <link href="favicon.png" rel="icon" type="image/png">
        <meta name="viewport" content="width=device-width, maximum-scale=1, initial-scale=1, user-scalable=0" />

        <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800" rel="stylesheet" type="text/css" />

        <link href="{{asset('assets/plugins/bootstrap/css/bootstrap.min.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/font-awesome.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/plugins/owl-carousel/owl.carousel.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/plugins/owl-carousel/owl.theme.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/plugins/owl-carousel/owl.transitions.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/plugins/magnific-popup/magnific-popup.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/animate.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/superslides.css')}}" rel="stylesheet" type="text/css" />

        <link href="{{asset('assets/plugins/revolution-slider/css/settings.css')}}" rel="stylesheet" type="text/css" />

        <link href="{{asset('assets/css/essentials.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/layout.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/slider.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/layout-responsive.css')}}" rel="stylesheet" type="text/css" />
        <link href="{{asset('assets/css/color_scheme/brown.css')}}" rel="stylesheet" type="text/css" /><!-- orange: default style -->

        <link href="{{asset('assets/css/color_scheme/brown.css')}}" rel="alternate stylesheet" type="text/css" title="brown" />

        <script type="text/javascript" src="assets/plugins/modernizr.min.js"></script>
        <link href="assets/css/jquery.bxslider.css" rel="stylesheet">

    </head>
    <body>


<div class="top-header"> 
        <div class="container">
            <div class="row">
                <div class="col-sm-6">
                   <div class="topleft">
                   <ul class="socials-icons">
                       <li><a href="https://web.facebook.com/AlQuraishPublishers?_rdr" target="_blank">
                       <i class="fa fa-facebook"></i> Facebook</a></li>
                       @if(\Auth::check())
                            <li>
                                <a href="{{url('admin')}}"><i class="fa fa-user"></i> Dashboard</a>

                            </li>
                        @else
                            <li>
                                <a href="{{url('login')}}"><i class="fa fa-user"></i> Log In</a>

                            </li>
                        @endif
                    </ul> 
                   </div>
                </div>
                <div class="col-sm-6">
                  <div class="topright">
                        <i class="fa fa-phone"></i> 92 42 37668958 , 37652546 , 37361439 &nbsp; 
                        <i class="fa fa-envelope-o"></i> <a class="wht" href="mailto:info@alquraish.com">info@alquraish.com</a>
                   </div>
                </div>
            </div>
        </div>
    </div>
        <!-- TOP NAV -->
        <div class="pos-absolute"> 
                <header id="topNav" style="height: 100px !important;"><!--data-spy="affix" data-offset-top="100" -->

                    <div class="container">
                     <!-- Top Header -->

        <div class="clearfix"></div>
                        <!-- Mobile Menu Button -->
                        <button class="btn btn-mobile" data-toggle="collapse" data-target=".nav-main-collapse">
                            <i class="fa fa-bars"></i>
                        </button>

                       <!-- Logo text or image -->
                        <!-- Logo text or image -->
                        <a class="logo" href="index.html">
                            <img src="assets/images/logo.png"> 
                        </a>

                        <!-- Top Nav -->
                        <div class="navbar-collapse nav-main-collapse collapse pull-right">
                            <nav class="nav-main mega-menu">
                                <ul class="nav nav-pills nav-main scroll-menu" id="topMain">
                                    <li><a href="{{url('/index')}}">Home</a></li>

                                    <li><a href="{{url('/about')}}">About Us</a></li>
                                    <li><a href="{{url('/books')}}">Books</a></li>
                                    <li><a href="{{url('/order')}}">Order Now</a></li>
                                    <li><a href="{{url('/contact')}}">Contact Us</a></li>
                                </ul>
                            </nav>
                        </div>
                        <!-- /Top Nav -->

                    </div>
                </header>
        </div>

        <!-- WRAPPER -->
        <div id="wrapper" >

            <!-- REVOLUTION SLIDER -->
            <div class="fullwidthbanner-container roundedcorners pos-reletive">
                <div class="fullwidthbanner">
                    <ul>    

                        <li data-transition="curtain-2" data-slotamount="5" data-masterspeed="700">
                            <img src="assets/images/sliders/1.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                        <li data-transition="curtain-2" data-slotamount="5" data-masterspeed="700">
                            <img src="assets/images/sliders/2.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                        <li data-transition="3dcurtain-vertical" ddata-slotamount="15" data-masterspeed="300" data-delay="9400">
                            <img src="assets/images/sliders/3.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                        <li data-transition="3dcurtain-vertical" ddata-slotamount="15" data-masterspeed="300" data-delay="9400">
                            <img src="assets/images/sliders/4.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                        <li data-transition="3dcurtain-vertical" ddata-slotamount="15" data-masterspeed="300" data-delay="9400">
                            <img src="assets/images/sliders/5.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                        <li data-transition="3dcurtain-vertical" ddata-slotamount="15" data-masterspeed="300" data-delay="9400">
                            <img src="assets/images/sliders/6.jpg" alt="" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
                        </li>

                    </ul>

                    <div class="tp-bannertimer"></div>
                </div>
            </div>
            <!-- /REVOLUTION SLIDER -->


            @section('content')

            @show



            <div class="container">
                <div class="row">
                    <div class="scroll-img">
                        <div id="clients-flexslider" class="flexslider home clients">

                            <div class="slider1">
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/1.png">
                                        <p>Nazia Kanwal Nazi</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/2.png">
                                        <p>Riaz Aqab</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/3.png">
                                        <p>Rizq Shah</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/4.png">
                                        <p>Malik Safdar Hayat</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/5.png">
                                        <p>Mehwish Iftikhar</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/6.png">
                                        <p>Fakhira Gull</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/7.png">
                                        <p>Asia Mirza</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/8.png">
                                        <p>Mirza Amjad Baig</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/9.png">
                                        <p>Anwar Ulaiqi</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/10.png">
                                        <p>Iffat Tahir</p>
                                  </div>
                                  <div class="slide">
                                        <img src="assets/images/gallery-scroll/11.png">
                                        <p>MA Rahat</p>
                                  </div>
                            </div>

                        </div>  
                    </div> <!--scroll-img ends-->


=> here is i have problem becuase this setion has data from database and giving me the error of " Undefined variable: " 

                    **<div class="col-md-12">
                        @include('layouts.homeWelcomeHeading')

                    </div>**



                </div> <!--row ends-->
            </div>


        </div>
        <!-- /WRAPPER -->

        <div class="container">
            <div class="row padding60">

                        <!-- FORM -->
                        <div class="col-md-6">


<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2FAlQuraishPublishers%2F&tabs=timeline&width=800&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="800" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>



                        </div>

                        <div class="col-md-6">
                            <h3>Message Board</h3>
                            <h4>Publisher, Books & Magazine Distribution Book Store</h4>
                            <p>Order your favorite Book / Novel And Get 35% Discount...
For Online Order message Us
Book will be delivered to your door step
Free Home Delivery all across Pakistan </p>

                        <form class="white-row" action="#" method="post">
                                <div class="row">
                                    <div class="form-group">
                                        <div class="col-md-6">
                                            <label>Full Name *</label>
                                            <input type="text" value="" data-msg-required="Please enter your name." maxlength="100" class="form-control" name="name" id="name">
                                        </div>
                                        <div class="col-md-6">
                                            <label>E-mail *</label>
                                            <input type="email" value="" data-msg-required="Please enter your email address." data-msg-email="Please enter a valid email address." maxlength="100" class="form-control" name="email" id="email">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group">
                                        <div class="col-md-6">
                                            <label>Phone / Mobile *</label>
                                            <input type="text" value="" data-msg-required="Please enter your name." maxlength="100" class="form-control" name="name" id="name">
                                        </div>
                                        <div class="col-md-6">
                                            <label>Subject *</label>
                                            <input type="email" value="" data-msg-required="Please enter your email address." data-msg-email="Please enter a valid email address." maxlength="100" class="form-control" name="email" id="email">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group">
                                        <div class="col-md-12">
                                            <label>Message *</label>
                                            <textarea maxlength="5000" data-msg-required="Please enter your message." rows="10" class="form-control" name="message" id="message"></textarea>
                                        </div>
                                    </div>
                                </div>

                                <br />

                                <div class="row">
                                    <div class="col-md-12">
                                        <input type="submit" value="Submit Message" class="btn btn-primary btn-lg" data-loading-text="Loading...">
                                    </div>
                                </div>
                            </form>

                        </div>


                    </div>
        </div>

        <section class="cover margin-footer parallax" data-stellar-background-ratio="0.7" style="background-image: url('assets/images/parallax_bg.jpg');">


                <div class="container">
                    <h3 align="center">Our customers have said</h3>

                    <div class="owl-carousel text-center" data-plugin-options='{"items": 1, "singleItem": true, "navigation": true, "pagination": false, "autoPlay": true, "transitionStyle":"fadeUp"}'><!-- transitionStyle: fade, backSlide, goDown, fadeUp,  -->
                        <div class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                            <cite><strong>Writer Name</strong>, Customer</cite>
                        </div>

                        <div class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                            <cite><strong>Writer Name</strong>, Customer</cite>
                        </div>

                        <div class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                            <cite><strong>Writer Name</strong>, Customer</cite>
                        </div>

                        <div class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                            <cite><strong>Writer Name</strong>, Customer</cite>
                        </div>

                    </div>

                </div>


            </section>  


        <!-- FOOTER -->
        <footer>
            <div class="clearfix"></div>
            <!-- footer content -->
            <div class="footer-content">
                <div class="container">

                    <div class="row">

                        <!-- FOOTER CONTACT INFO -->
                        <div class="column col-md-8">
                            <h3>Title</h3>


                            <p class="contact-desc">
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
                            </p>

                            <p class="contact-desc">

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.               
                            </p>

                        </div>
                        <!-- /FOOTER CONTACT INFO -->


                        <!-- FOOTER Profile -->
                        <div class="column col-md-4">
                            <h3>Get In Touch</h3>

                            <address class="font-opensans">
                                <ul>
                                    <li class="footer-sprite address">
                                       text will be here 
                                    </li>
                                    <li class="footer-sprite phone">
                                        <strong>Landline:</strong> +1234567789<br> 
                                    </li>
                                    <li class="footer-sprite email">
                                        <a href="mailto:info@mail.com"> info@mail.com</a><br>
                                    </li>
                                </ul>
                            </address>
                        </div>
                        <!-- /FOOTER Profile -->

                    </div>

                </div>
            </div>
            <!-- footer content -->
<!-- copyright , scrollTo Top -->
            <div class="footer-bar">
                <div class="container">
                    <span class="copyright">Copyright &copy; All Rights Reserved.   
                    <span style="display:inline-block; text-align: right; float: right; ">&nbsp; || &nbsp;
                    Powered by: <a href="#" target="_blank"><small>Me</small></a></span>
                    </span>
                    <a class="toTop" href="#topNav">Go To Top <i class="fa fa-arrow-circle-up"></i></a>
                </div>
            </div>
            <!-- copyright , scrollTo Top -->
        </footer>
        <!-- /FOOTER -->


        <script type="text/javascript" src="assets/plugins/jquery-2.1.4.min.js"></script>
        <script type="text/javascript" src="assets/plugins/jquery.easing.1.3.js"></script>
        <script type="text/javascript" src="assets/plugins/jquery.cookie.js"></script>
        <script type="text/javascript" src="assets/plugins/jquery.appear.js"></script>
        <script type="text/javascript" src="assets/plugins/jquery.isotope.js"></script>
        <script type="text/javascript" src="assets/plugins/masonry.js"></script>

     <script src="assets/js/jquery.bxslider.js"></script>
     <script src="assets/js/jquery.bxslider.min.js"></script>

     <script type="text/javascript">   

 $(document).ready(function(){
  $('.slider1').bxSlider({
        auto: true,
        autoControls: true,
        slideWidth: 155,
        minSlides: 2,
        maxSlides: 7,
        slideMargin: 10,
        pager: true,
        moveSlides: 2,

        /*'auto': true,
        'autoControls': true,
        'pager':false,
          'pager':false,
          'infiniteLoop':false,
          'minSlides':1,
          'maxSlides': 3,
          'slideWidth': '210px',
          'slideMargin':5*/
  });
  $('#slider2').bxSlider({
        'auto': true,
        'autoControls': true,
        'adaptiveHeight': true,
        /*mode: 'vertical',*/
});
});

 </script> 

        <script type="text/javascript" src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="assets/plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
        <script type="text/javascript" src="assets/plugins/owl-carousel/owl.carousel.min.js"></script>
        <script type="text/javascript" src="assets/plugins/stellar/jquery.stellar.min.js"></script>
        <script type="text/javascript" src="assets/plugins/knob/js/jquery.knob.js"></script>
        <script type="text/javascript" src="assets/plugins/jquery.backstretch.min.js"></script>
        <script type="text/javascript" src="assets/plugins/superslides/dist/jquery.superslides.min.js"></script>

        <script type="text/javascript" src="assets/plugins/mediaelement/build/mediaelement-and-player.min.js"></script>
        <script type="text/javascript" src="assets/plugins/revolution-slider/js/jquery.themepunch.tools.min.js"></script>
        <script type="text/javascript" src="assets/plugins/revolution-slider/js/jquery.themepunch.revolution.min.js"></script>
        <script type="text/javascript" src="assets/js/slider_revolution.js"></script>
        <script type="text/javascript" src="assets/js/scripts.js"></script>


    </body>




</html>

3-控制器

代码语言：javascript
复制
public function showIndex()
{
    //$text = DB::table('content')->get();
    $text = Content::all();
    return view('index', ['ok', $text]);
}

在这个问题上请帮助我，我被卡住了。

php
laravel
laravel-5.2
laravel-5.3
laravel-5.4
EN

回答 2

Stack Overflow用户

发布于 2017-02-12 13:18:19

就我从你的问题中所理解的，如果你需要在master中插入多个动态部分，你需要多个yeilds，比如

代码语言：javascript
复制
@yield('content')
@yield('dynamin-1')
@yield('dynamic-2')
.......
.......

然后，在另一个刀片文件中，您需要扩展母版并插入像这样的部分

代码语言：javascript
复制
@extends('layouts.master')

@section('content')
bla bla <strong>bla bla bla....</strong>
@endsection

@section('dynamin-1')
bla bla <strong>bla bla bla....</strong>
@endsection

@section('dynamin-2')
bla bla <strong>bla bla bla....</strong>
@endsection

....

因此，在您的情况下，您不需要在您的主控中的@section('content')，除非您有意识地将其放入！每当您要将@section('content')放在扩展view中时，master中的这一节都将被覆盖！

票数 1
EN

Stack Overflow用户

发布于 2017-02-27 03:07:40

亲爱的，我觉得你在用

代码语言：javascript
复制
@section() // instead of yield()

请确保您使用

代码语言：javascript
复制
@yield('content')
@yield('section1')
@yield('section2')

在master.blade php中

在子页面中，您可以这样做

代码语言：javascript
复制
@extends('layouts.master')

@section('content')

@endsection

@section('section1')

@endsection

@section('section2')

@endsection
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/42184230

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档