Laravel 5 系列教程三：视图变量传递和Blade

jindong 发布于2019-06-27 11:28 / 1326人阅读

摘要：所以在视图中我们需要这样输出这里应写成，而不是。这个时候注意更改视图的变量输出。

</>复制代码 
原文来自： https://jellybool.com/post/programming-with-laravel-5-blade-views-with-var
系列文章： http://segmentfault.com/blog/jellybool

免费视频教程地址 https://laravist.com/series/laravel-5-basic

上一篇我们简单地说了Router，Views和Controllers的工作流程，这一次我就按照上一篇的计划，来说说下面几个内容：

向视图中传递变量

Blade模板的用法

原来的数据库配置放下一节了

向视图中传递变量

我们在开发web应用当中，通常都不是为了写静态页面而生的，我们需要跟数据打交道，那么这个时候，问题就来了，在一个MVC的框架中，怎么将数据传给视图呢？比如我们要在 ArticleController 的 index 方法的视图输出一个 $title 的变量，在Laravel中，有下面几种常见的方法：

使用with()方法

</>复制代码 
 public function index()
    {
        $title = "文章标题1";
        return view("articles.lists")->with("title",$title);
    }

这样的 with("title",$title) 中，第一个 "title" 就是key，第二个 $title 就是值，这样我们就可以在我们的 articles/lists.blade.php 中输出这个变量了：

</>复制代码

刷新我们的 blog.dev ，就可以看到类似这样的页面了：

而在blade引擎中，我们可以这样输出变量：

</>复制代码 
{{ $title }}

其实在blade引擎中， {{ $title }} 会被解析为类似这样的输出，不过这里的 {{ }} 符号会将数据原样输出，比如你将 $title 写成这样：

</>复制代码 
 public function index()
    {
        $title = "文章标题1";
        return view("articles.lists")->with("title",$title);
    }

这个时候你用 {{ $title }} 输出，会看到类似下面这样：

如果你想将 $title 作为页面元素渲染输出，你需要这样写：

</>复制代码 
{!! $title !!}

这里的 {{ }} 和 {!! !!} 是blade的最基础的用法，这两个我们会用得特别多，后面我会详细说说blade的用法。

直接给view()传参数

使用这个方法的时候，你可以这样写：

</>复制代码 
public function index()
    {
        $title = "文章标题1";
        return view("articles.lists",["title"=>$title]);
    }

刷新页面，你依然会看到一样的输出。这里需要说明一下，如果你传多个变量，比如：

</>复制代码 
 public function index()
    {
        $title = "文章标题1";
        $intro = "文章一的简介";
        return view("articles.lists",[
                                        "title"=>$title,
                                        "introduction"=>$intro
                                        ]);
    }

在传递的数组中：

</>复制代码 
[
"title"=>$title,
"introduction"=>$intro
]

每一个key会在视图中作为变量，而 value 就作为变量的值。所以在视图中我们需要这样输出：

</>复制代码 
{!! $title !!}
{{ $introduction }}

这里应写成 {{ $introduction }} ，而不是 {{ $intro }} 。

使用compact

使用compact是这样写的：

</>复制代码 
 public function index()
    {
        $title = "文章标题1";
        $intro = "文章一的简介";
        return view("articles.lists",compact("title","intro"));
    }

compact() 的字符串可以就是变量的名字，多个变量名用逗号隔开。这个时候注意更改视图的变量输出。

以上就是Laravel中常用的几种向视图传递变量的方法，选择一种你喜欢的方式并坚持这一种写法就可以了，我是使用第三种。

Blade的基本用法

上面的内容介绍了一点点blade的语法，这里我们再统一介绍blade，说说下面几个比较常用的：

</>复制代码 
@yield()
@extends()
@if() and @unless()
@foreach()

@yield() 和 @extends() 通常会结合者使用，实现我们通常所说的layouts布局：就是在web开发的过程中，我们将一些公用的部分如 header ， footer 等直接放在一个视图文件中，然后在使用的使用直接继承 (使用@extends) 就可以了，比如我们在 resources/views/ 文件夹之下创建一个 app.blade.php ：

</>复制代码 
    
    
    
    <span class="hljs-attr">Laravel</span> <span class="hljs-string">5 教程</span>
    
    
    @yield("content")
    
        
                            
                    Laravel 5 Blog

写上这么一些内容，其中css这个 href="/css/all.css" ，需要我们手动在 public/ 文件夹之下创建css/文件夹，并创建all.css这个文件，对于js的src="/js/all.js"也是同理，这两个文件是为了后面的页面美化而做的提前准备。

注意到@yield("content")这个语法，这里就是说，这里有一个content的内容区域，如果某个页面继承了这个app.blade.php，然后那个页面就可以动态改变@yield("content")的内容了。比如我们在articles/lists.blade.php中，我们继承一下app.blade.php:

</>复制代码 
@extends("app")
@section("content")
{!! $title !!}
{{ $intro }}
@endsection

这里的第一行@extends("app")就是声明这个页面继承于app.blade.php，也就是我们的articles/lists.blade.php可以使用到all.css和all.js文件，然后@section("content")就是对于app.blade.php的@yield("content")，表明就是：在渲染加载articles/lists.blade.php的时候，@yield("content")这部分内容会被替换为下面的内容：

</>复制代码 
{!! $title !!}
{{ $intro }}

@if()通常是用于在视图中根据某些条件来判断是否该显示某些内容，比如我们可以很“无聊”地试试这样：

</>复制代码 
public function index()
    {
        $first = "jelly";
        $last = "bool";
        return view("articles.lists",compact("first","last"));
    }

在views文件中，我们使用一下@if():

</>复制代码 
@extends("app")
@section("content")
 @if($first == "jellybool")
 {{ $first }}
 @else
 {{ $last  }}
@endif
@endsection

刷新一下就可以看到页面的输出，为$last的值。

上面的@if()，还有一个可以使用的标签就是@unless()，@unless()就可以理解为 if( ! )，就是if not 这样理解就OK。

@foreach()用于循环输出变量，比如：

</>复制代码 
public function index()
    {
        $first = ["jelly","bool"];
        return view("articles.lists",compact("first"));
    }

我们传一个数组给视图，然后，我们就可以使用@foreach()循环输出了：

</>复制代码 
@extends("app")
@section("content")
@foreach( $first as $name)
     {{ $name }}
@endforeach
@endsection

刷新一下页面，就可以看到循环的结果了：

blade的更多知识，可以参考文档：

http://laravel.com/docs/5.1/blade

下一节

貌似上面配置数据库链接之后还没有用到，不用着急，我接下来的一篇会具体说说Eloquent的用法，这个在Laravel中是很有代表性的部分，希望你可以学到一点东西。

Happy Hacking

GPU云服务器云服务器 laravel视图系列三变量程序视图mfc 变量传递

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/21076.html

Laravel 5系列教程五：MVC的基本流程

摘要：原文来自免费视频教程地址期间受到很多私事影响，终于还是要好好写写的教程了。我们来实现这个功能显示文章详情通过文章展示来快速体验上面的流程注册路由来到中，我们增加一个路由上面的路由指定我们需要加载中的方法。原文来自： https://jellybool.com/post/programming-with-laravel-5-model-controller-view-basic-wor...

mrcode 2019-06-27 11:31 评论0 收藏0
Laravel 5 系列教程二：路由，视图，控制器工作流程

摘要：但是不用担心，我们后续的教程会陆续讲解相关的内容。所以上面的路由注册其实就是负责解决访问的时候的响应。原文来自：https://jellybool.com/post/programming-with-laravel-5-routers-views-controllers-workflow 免费视频教程地址 https://laravist.com/series/laravel-5-b...

awesome23 2019-06-27 11:28 评论0 收藏0
laravel5.5手写教程3的基于资源路由的CURD操作（适合初学者）

摘要：新增一篇新闻新增失败输入不符合要求请输入标题请输入内容新增文章上面代码中的是为了防攻击的，每个表单都必须存在。本文我将结合简单例子，完成laravel框架下的增删改查，希望会对大家有所帮助。在进行之前，大家应该保证自己的数据库链接无误,artisan命令能正常使用，路由链接无问题。一、创建控制器、路由避免影响其他路由，我们先注释掉之前联系时编写的所有路由。因为上一章我们已经学会建立...

olle 2019-07-01 12:24 评论0 收藏0
Laravel 5.4 入门系列 2. 路由与视图

摘要：路由与视图主要知识点从路由到视图的基本流程数据传递我们来看看第一讲最后的页面是怎么出来的。现在，再次访问，变成了我们定义的内容。 2. 路由与视图主要知识点：从路由到视图的基本流程数据传递我们来看看第一讲最后的页面是怎么出来的。先来看看路由: // /routes/web.php Route::get(/, function () { return view(wel...

dockerclub 2019-06-27 16:05 评论0 收藏0
laravel框架应用和composer扩展包开发

摘要：官方地址是目前最流行的框架，发展势头迅猛，应用非常广泛，有丰富的扩展包可以应付你能想到的各种应用场景，框架思想前卫，跟随时代潮流，提倡优雅代码，自称为工匠，其中的模板引擎容器以及扩展包为业务的开发提供了极大的便利。 laravel5.5+ laravel官方地址 laravel是目前最流行的php框架，发展势头迅猛，应用非常广泛，有丰富的扩展包可以应付你能想到的各种应用场景，lara...

shevy 2019-07-01 10:20 评论0 收藏0

发表评论

登陆后可评论

0条评论

jindong

男|高级讲师

我要关注我要私信

TA的文章

测试工具研发_脚本（最终版）：数据个数以及保存文件的处理

阅读 3264·2021-10-08 10:04
Codeforces Round #744 (Div. 3) A-F 题解

阅读 1227·2021-09-30 09:48
阿帕云引擎idc管理系统搭建：中小企业如何搭建idc业务系统?

阅读 3605·2021-09-22 10:53
WordPress主题插件可用Poedit客户端软件汉化（多语种支持准确度高）

阅读 1815·2021-09-10 11:22
wifi修复记录（8个方法）

阅读 1822·2021-09-06 15:00
如何把css'content的操作跟价值发挥到最大

阅读 2287·2019-08-30 15:56
CSS > ICONFONT 基线和大小问题

阅读 805·2019-08-30 15:53
Background背景色透明RGBA和opacity的对比实例（转载）

阅读 2398·2019-08-30 13:04

资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

Laravel 5 系列教程三：视图变量传递和Blade

</>复制代码

</>复制代码

</>复制代码

</>复制代码

{{ $title }}

</>复制代码

</>复制代码

{!! $title !!}

</>复制代码

</>复制代码

</>复制代码

</>复制代码

{!! $title !!}

</>复制代码

</>复制代码

</>复制代码

</>复制代码

{!! $title !!}

</>复制代码

{!! $title !!}

</>复制代码

</>复制代码

{{ $first }}

{{ $last }}

</>复制代码

</>复制代码

{{ $name }}

相关文章

发表评论

0条评论

男|高级讲师

TA的文章

最新活动

`{{ $title }}`

`{!! $title !!}`

`{!! $title !!}`