一、什么是视图?
视图包含你应用程序所用到的 HTML,它能够将控制器和应用程序逻辑在呈现逻辑中进行分离。laravel是一个很经典的MVC结构的
简单的来说视图就是我们的网站能看到的一个一个的界面,在前面的实验中,为了简单,我们在处理完路由请求后返回的都是一些简单的字符,并没有使用真正的视图。
从本次实验开始,我们将加入视图使我们的网站更美观:)
二、视图基础
视图文件存放在resources/views
目录下,还记得刚安装完 laravel 的时候的欢迎页吗,这就是一个视图文件。
我们打开 resources/views/welcome.blade.php
这个文件:
<!DOCTYPE html>
<html>
<head>
<title>Laravel</title>
<link href="https://fonts.googleapis.com/css?family=Lato:100" rel="stylesheet" type="text/css">
<style>
html, body {
height: 100%;
}
body {
margin: 0;
padding: 0;
width: 100%;
display: table;
font-weight: 100;
font-family: 'Lato';
}
.container {
text-align: center;
display: table-cell;
vertical-align: middle;
}
.content {
text-align: center;
display: inline-block;
}
.title {
font-size: 96px;
}
</style>
</head>
<body>
<div class="container">
<div class="content">
<div class="title">Hello World</div>
</div>
</div>
</body>
</html>
如果你有过前端开发经验的话,这个界面你一定会很熟悉,视图文件就是主要以 HTML 组成的。
打开 routes.php 文件:
app/Http/routes.php
<?php
Route::get('welcome', function () {
return view('welcome');
});
我们可以像这样使用全局的辅助函数 view 来返回一个视图:
Route::get('/', function () {
return view('greeting', ['name' => 'James']);
});
view() 辅助函数的第一个参数会对应到 resources/views 目录内视图文件的名称。
view() 辅助函数的第二个参数是一个能够在视图内取用的数据数组。
视图文件也可以保存在resources/views
目录下的子文件夹内,比如我们打开resources/views
这个目录可以看到有一个 errors 文件夹,里边有一个 503.blade.php 文件 这个文件是 laravel 为我们生成的一个用来显示错误的页面,那么如何显示这个视图呢?
打开 routes.php 文件,添加以下代码:
app/Http/routes.php
<?php
Route::get('errors', function () {
return view('errors.503');
});
然后访问 localhost/errors 就可以看到这个视图了。
然后我们再尝试给视图文件传一个参数,打开 routes.php 文件,修改代码:
app/Http/routes.php
<?php
Route::get('errors', function () {
return view('errors.503', ['message' => '503 ERROR']);
});
相应的,打开resources/views/errors/503.blade.php
,修改代码:
resources/views/errors/503.blade.php
<!DOCTYPE html>
<html>
<body>
<div class="container">
<div class="content">
<div class="title">{{ $message }}</div>
</div>
</div>
</body>
</html>
其中 {{ $message }}
是 blade 模板语法,意思是输出 $message 这个变量,下次实验会专门学习 blade 模板引擎。
然后访问 localhost/errors 可以看到参数成功被传到了视图:
三、创建一个视图
下面我们为首页创建一个最简单的视图,并使用控制器。
1.首先,打开 routes.php 修改首页路由
app/Http/routes.php
<?php
//首页
Route::get('/', 'HomeController@home')->name('home');
使用 artisan 创建控制器:
cd ~/Code/myweb
php artisan make:controller HomeController --plain
打开app/Http/Controllers/HomeController.php
创建 home 方法:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
class HomeController extends Controller
{
public function home()
{
return view('home');
}
}
2.创建视图
在 resources/views 目录下创建一个文件
命名为 home.blade.php
这样命名是因为我们要使用 laravel 的 blade 模板引擎来渲染我们的视图,blade 模板会在下一次实验讲到
然后打resources/views/home.blade.php
文件,添加代码:
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
</head>
<body>
<h1>Home</h1>
<p>Welcome to My web</p>
</body>
</html>
访问 localhost 就可以看到我们创建的视图了。
四、小结
如果之前学习过安卓的话,这一部分相当简单了,就是简单的MVC结构,就连文件夹的命名规则都很像,不过这里还是要注意的,慢慢的看出编码规范了,控制部分一般卸载control里面,也就是第二个例子的形式!!!
参考:实验楼