欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

宁皓网 Laravel 5:视图 有大用

shiping1 的头像

Laravel 里的视图。

封面摄影:Adrian Borda
来自 http://ninghao.net/course/3281#info
 

介绍
视图 - views

在路由里可以定义一些地址,用户可以请求这些地址得到他们想要的内容,路由收到请求先决定一下是自己捣鼓一下这个请求,还是把请求交给控制器去处理。不管怎么样,最终可能都会为用户返回一些内容。

这些内容可能会混杂着具体的数据,还有一些展示这些数据用的 html ... 我们可以把这些展示用的东西从路由或者控制器里面分离出来。这就是我们下面要介绍的视图,英文是 Views 。

在 Laravel 项目里,视图一般会放到 resources ... views 这个目录的下面。
来自 http://ninghao.net/video/3282#info

基础
视图的基本使用

在介绍 Laravel 控制器的时候,我们创建了一个叫 MovieController 的控制器 .. 打开 app/Http/Controllers .. 在这里找到这个 MovieController.php ..

在这个控制器里, index 方法是返回电影列表用的一个方法 .. 我们直接返回的是一个字符串 .. 电影列表 .. 在这里假设控制器从数据库里找出了一些电影列表的内容 .. 然后我们就可以把这些数据交给一个视图 .. 先直接返回一个视图 .. return 一个 view .. 这个 view 方法的第一个参数是要使用的视图的名字 ... 设置成 movie-list ...

return view('movie-list');

再打开 app/Http/ 下面的 routes.php .. 先删除掉里面的所有的东西 .. 留下这个默认的路由 .. 还有这个 movie 路由 .. 这里用了一个 resource 类型的路由,里面用的就是刚才我们看到的那个 MovieController 控制器 .. 去掉它的第三个参数 .. 再保存一下 ..

下面我们可以去创建一个视图文件 .. 放到 resources 下面的 views 这个目录的下面 .. 名字是 movie-list.php .. 在这里用一组 h1 标签 .. 里面的文字是 电影列表 ... 保存 ...

打开浏览器 ... 访问一下 movie 这个地址 ... 显示的就是在 movie-list.php 这个视图里的那个用 h1 标签包装的电影列表这几个字儿。
来自 http://ninghao.net/video/3284#info

视图的组织与判断

在这个 index 方法里面,我们用了一个 view 返回了一个视图 .. 在这个方法里,直接用了视图的名字.. 不包含视图的具体的位置,也没有文件的扩展名 .. 默认它会到 resources 目录下面的 views 这个目录里面去找想要使用的视图 ..

我们也可以把相关的视图放到一个子目录里面去存储 .. 先找到这个 movie-list 视图 .. 选中它 .. 移动一下它的位置 .. 按一上 m .. 把它放到 views 下面的 view 这个目录里面 ... 重命名一下这个视图文件 .. 叫它 list ..

再回到使用了这个视图的控制器 .. 修改一下要使用的视图的名字 .. 这里要先输入这个视图相对 resources 下面的 views 这个目录的路径 .. 这里就是 view ,再用一个点 .. 接着是这个视图的名字 .. list ..

保存 .. 打开浏览器 .. 访问一下 movie 这个地址 .. 仍然会正常的显示视图里的内容 ..

在使用视图之前我们也可以判断一下视图是不是存在 .. 回到编辑器 .. 用一个 if .. 判断的条件可以使用一个 view() .. 不加参数 .. 后面再用一个 exists 方法 .. 把要判断的视图交给这个方法 .. 这里就是 view.list .. 如果视图存在,就会返回 true ..

保存 .. 再到浏览器上看一下 .. 这里还可以正常显示 .. 因为判断的视图是存在的 ..
来自 http://ninghao.net/video/3285#info

 
把数据交给视图

在路由或者控制器里,我们得去获取到用户请求的数据,然后把这些数据传递到视图里去用 .. 在 MovieController 这个控制器的 index 方法里面,我们用了一个叫 view 目录下的 list 这个视图 .. 给视图传递数据可以这样 .. 放到 view 的第二个参数里面 ..它的值是一个数组 .. 数组里的项目就是传递给视图的数据 ..

先是数据的名字 .. 比如 title .. 大箭头的右边是跟 title 这个名字对应的具体的值 .. 设置成 电影列表 .. 保存 .. 再打开 view 目录下的 list 这个视图 ...

在这里可以使用传递给它的数组 .. 从那个 index 方法里面传递了一个叫 title 的数据 .. 我们可以把它放到这个 h1 标签里面 .. 去掉这个静态的文字 .. 换成一组 php 标签 .. 输出 $title 保存 .. 回到浏览器 .. 再请求一下 movie 这个地址 ..

这里仍然会显示用 h1 标签包装的文字 .. 不过这次里面要显示的文字是从控制器的方法里面传递给视图的 ... 我们也可以使用 with 方法传递数据 .. 回到编辑器 .. 去掉 view 的第二个参数 .. 在它后面用一个 with .. 这个方法的第一个参数是传递的数据的名字 .. title .. 第二个参数是具体的值 .. 电影列表 .. 保存 ..

回到浏览器 .. 这里仍然会显示出传递给 view.list 这个视图的数据 ..
来自 http://ninghao.net/video/3286#info

在全局共享数据给所有的视图

我们可能在全局范围共享一些数据给所有的视图 .. 这些数据要放到 AppServiceProvider 里面 .. 打开 app/Providers .. 找到 AppServiceProvider.php ..

我们可以把要共享给所有视图的数据放到它的 boot 这个方法里面 .. 用一个 view() .. 接着再用一个 share .. 把要共享的数据放到这个方法里面 .. 第一个参数是数据的名字 .. 比如用一个 site_name .. 第二个参数是具体的值 .. 设置成 宁皓网 ..

保存 .. 这样我们就可以在所有的视图上,去使用 site_name 这个数据了 .. 打开 list 这个视图 .. 先用一组 div 标签 .. 里面加上一个版权的符号 .. 然后再输出 site_name ... 保存 .. 回到浏览器 .. 刷新一下 ..

这里会显示我们在 AppServiceProvider 里的 boot 方法里,共享给所有视图的 site_name 这个数据 ...
来自 http://ninghao.net/video/3287

Views Composer
Views Composer 介绍

视图的 Composer 就是在显示视图的时候要调用的东西。 比如你有一个视图,里面可能需要一些特定的数据,在每个要使用视图的地方,你都需要把这些视图需要的数据传递给视图。

比如一个导航栏的视图,上面可能需要显示一个未读的通知的消息的数量 .. 在其它的视图里面你可能需要组合使用这个导航栏视图 .. 这样你就需要在每一个使用这个视图的地方,把导航栏视图里需要的那个未读消息数量的值传递进来 ..

得到这个未读消息数量可能需要用到一些逻辑运算 .. 我们可以把这部分东西分离出开,放到视图的 Composer 里面 .. 在视图里组合使用视图的时候,就会去调用视图的 Composer .. 也就不需要在每一个使用视图的地方单独去给这些在视图里组合使用的视图传递数据了 ..

听起了有点绕 .. 下在我们通过一个例子来了解一下这个视图的 Composer ..

来自  http://ninghao.net/video/3289#info

使用视图 Composer 前的准备

我们先去创建一个视图 .. 放到 resources/views 下面,再创建一个单独的目录 .. 名字是 layout .. 这个视图的名字是 nav.blade.php .. 在视图里可以用一下 Laravel 的 blade 模板引擎 .. 这种视图的名字里面,需要加上一个 blade .. 在以后我们会单独介绍 blade 模板引擎的具体用法 ..

先添加一组 div .. 里面包装一个 div .. 这个 div 里的文字是 ninghao.net .. 下面再添加一组 div ,里面是要显示的通知消息的数量 ..

用两组花括号 .. 里面是一个变量的名字 .. 比如 $notifications .. 在这个 div 上面添加点样式 .. 先用点行内的样式 ... 添加一个 style 属性 .. 背景设置成 #eee .. 再添加点内边距 .. 设置成 5px .. 用一个 width 设置一下宽度 .. 10px .. 里面的文字的颜色设置成红色 ..

再去重命名一下 view 下面的 list.php .. 改成 list.blade.php .. 在这个视图文件里面,可以去组合一下其它的视图 .. 比如刚才我们定义的 nav 这个视图 .. 用一个 @include .. 导入 layout 目录下的 nav 这个视图 ..

打开 app/Http/Controllers .. 找到 MovieController .. 在这个控制器里,index 方法用到了 view 下面的 list 这个视图 .. 打开浏览器 . . 访问一下 movie 这个地址 .

这里报了一个错 .. Undefined variable: notifications .. 就是 notifications 这个变量没定义 .. 这是因为在 MovieController 这个控制器里的 index 方法要使用的 view 下面的 list 这个视图里面,组合使用了 layout 下面的 nav 这个视图 ..

在这个 nav 视图里,要显示 notifications ... 这个东西我们还没有给它传递数据 .. . 在 index 方法里面 .. 先修改一下传递数据给视图的方式 .. 设置一下 view 的第二个参数 .. 用一个数组 ..

在这里,我们再去给视图传递一个 notifications 数据 .. 它的值可能需要到数据库里查询一下 .. 做一些逻辑的运算 .. 我们假设得到的就是数字 5 ..

保存 .. 回到浏览器 .. 刷新一下 .. 这回就显示正常了 .. 这个页面上会包装在 nav 视图里输出的东西 .. ninghao.net ,加上 notifications 的值 ..

现在,如果我们在路由或者控制器的方法里面,使用的视图组合使用了这个 nav 视图,你就需要给这个 nav 视图传递一个名字是 notifications 的数据 ...

这样会重复的去做很多事情 .. 而且得到这个数据的值也需要做一些逻辑运算 .. 它会让我们的控制器越来越胖 .. 下面我们使用视图的 Composer 去解决这个问题 ..
来自 http://ninghao.net/video/3290

使用视图的 Composer

我们先去创建一个新的 ServiceProvider .. 使用命令行很方便 .. 打开终端 .. 进入到 Laravel 项目所在的目录 .. 然后用 php artisan make:provider 这个命令 .. 后面加上要创建的 Provider 的名字 .. 这里我们叫它 ComposerServiceProvider ..

php artisan make:provider ComposerServiceProvider

回车执行一下 .. 成功以后,回到编辑器 .. 打开 app/Providers .. 这里可以找到刚才创建的 ComposerServiceProvider .. 下面我们还得告诉 Laravel 一下,自己创建的这个 ServiceProvider 的位置 ..

打开 config 目录下面的 ... app.php .. 找到 providers 这个数组 .. 在最后添加一个 .. App\Providers\ComposerServiceProvider::class,

保存 .. 再打开 ComposerServiceProvider .. 在 boot 这个方法里面,可以用一下 view() .. 接着是 composer 这个方法 .. 它的第一个参数是要组合使用的视图的名字 .. 这里输入一个 layout.nav .. 意思就是,如果有视图组合使用 layout 目录下的 nav 这个视图 .. 就调用一下这个 composer ..

它的第二个参数可以是一个匿名函数 .. 这个函数接收一个 $view 参数 .. 在它里面,再用一个 $view ,使用一下 with 方法 .. 把得到的数据交给视图 .. 先是数据的名字 .. notifications .. 然后是具体的值 .. 这个值可能是通过一些运算得到的 .. 这里为了简单,我们直接设置一个数字 ..

保存 .. 再打开 MovieController 这个控制器 .. 这里我们就不再需要传递 notifications 这个数据了 .. 因为在它使用的 list 这个视图里面,组合使用 layout 下面的 nav 这个视图的时候,会调用视图的 Composer,在这个视图的 Composer 里面,我们已经得到了数据并且把它传递给了这个视图 ..

在找一个方法去用一下这个视图 .. 比如这个 show 方法 .. 同样不需要传递 notifications 这个数据 ..

保存一下 .. 回到浏览器 .. 先访问一下 movie 这个地址 .. 报了一个错 .. 回过再看一下 .. 是因为这里少了一具分号 .. 保存 .. 再回到浏览器 .. 刷新 ..

这里会显示 layout 下面的 nav 这个视图里的东西 ..

再试一下访问 movie/3 .. 同样在这个页面上会显示 layout 下面的 nav 这个视图的东西 .. 这个视图里用的 notifications 这个数据是在它的 Composer 里面得到的。
来自 http://ninghao.net/video/3291

创建单独的 Composer

在 ComposerServiceProvider 里面,我们直接使用了一个匿名函数 .. 如果这里要使用大量的逻辑运算的话 .. 可以把它们放到一个类里面。

像这样 .. 复制一段 .. 把它的第二个参数换成一个类 .. 这个类可以放到 App\Http\ViewComposers 目录的下面,名字是 NavComposer ..

保存 .. 再去创建这个类 .. 放到 app/Http/ViewComposers 下面,名字是 NavComposer.php .. 添加一个 php 开始的标记 ..

再定义一个类 .. 类的名字是 NavComposer .. 不继承其它的东西 .. 在这个类里面,需要添加一个 compose 方法 .. Laravel 默认会使用这个方法 ..

它接收一个参数 .. View $view .. 在这个方法里面,把需要交给视图的数据放到这里 . 使用这个 $view 的 with .. 数据的名字是 notifications .. 值先手工的设置一下 .. 输入一个 5 ..

再去设置一下这个类的命名空间 .. 用一个 namespace .. App\Http\ViewComposer .. 再用一个 use .. 因为下面用到了这个 View .. Illuminate\Contracts\View\View;

保存 .. 回到浏览器 .. 刷新 .. 仍然可以正常的显示 ...

来自 http://ninghao.net/video/3292

 
普通分类: