• PHP laravel系列之视图


    一、什么是视图?

    视图包含你应用程序所用到的 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 AppHttpControllers;
    
    use IlluminateHttpRequest;
    
    use AppHttpRequests;
    use AppHttpControllersController;
    
    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里面,也就是第二个例子的形式!!!

    参考:实验楼

  • 相关阅读:
    linux脚本启动停止一个jar
    如何突破各种防火墙的防护 [转]
    linux查看端口占用
    网页标题图标添加
    Go语言的一些使用心得
    kubernetes系列之ConfigMap使用方式
    Kubernetes因限制内存配置引发的错误
    Kubernetes系列之理解K8s Service的几种模式
    kubernetes中的Pause容器如何理解?
    Kubernetes系列之Helm介绍篇
  • 原文地址:https://www.cnblogs.com/zswbky/p/8454121.html
Copyright © 2020-2023  润新知