집 > 기사 > 백엔드 개발 > MVC, 양식 및 레이아웃 살펴보기: Yii2 프로그래밍 가이드

MVC, 양식 및 레이아웃 살펴보기: Yii2 프로그래밍 가이드

WBOY원래의: 2023-09-01 17:41:08846검색

探索 MVC、表单和布局：Yii2 编程指南

Yii2 프로그래밍: 시작하기에서는 Yii2를 로컬로 설정하고, Hello World 애플리케이션을 구축하고, 원격 서버를 설정하고, Github를 사용하여 코드를 배포했습니다. 이 튜토리얼에서는 MVC 프레임워크 구현과 관련된 Yii의 보다 기본적인 개념인 모델, 뷰 및 컨트롤러를 다룹니다. 또한 탐색 메뉴와 Bootstrap 요소의 레이아웃과 사용자 정의에 대해서도 살펴보겠습니다.

이러한 예에서는 자체 미니 트위터와 같이 간단한 상태 업데이트를 게시하기 위한 프레임워크를 구축한다고 가정합니다. 그러나 우리는 데이터베이스에 데이터를 저장하지 않습니다. Gii라는 Yii의 스캐폴딩 기능을 살펴보는 다음 튜토리얼을 위해 이를 저장하겠습니다.

Gii는 이 튜토리얼에서 수행할 모든 작업을 자동화하고 단순화하지만 기본 개념을 이해하고 이러한 작업을 한 번 이상 수동으로 수행하는 것이 중요합니다.

모델

모델이란 무엇인가요? Wikipedia에 따르면 "Model은 상태가 변경되면 관련 뷰와 컨트롤러에 알립니다. 이 알림을 통해 뷰는 업데이트된 출력을 생성하고 컨트롤러는 사용 가능한 명령 세트를 변경할 수 있습니다."

저에게 모델은 일반적으로 "외부" 세계에서 제가 만들고 있는 모든 것의 개념을 나타냅니다. 따라서 상태 업데이트를 고려하면 상태 모델에는 상태 업데이트의 모든 속성과 상태 쿼리 또는 변경과 관련된 모든 함수 또는 메서드가 포함됩니다.

모범 사례는 모델에 최대한 많은 기능과 지능을 구축하는 것입니다. MVC 실습에서는 "무거운" 모델과 가벼운 컨트롤러 및 뷰를 구축합니다. Yii는 웹 및 애플리케이션 개발 작업에 특화된 몇 가지 뛰어난 기능을 제공하며, 특히 양식 및 데이터베이스와 관련하여 모델 구축을 단순화할 수 있으며 대부분은 이후 튜토리얼에서 살펴볼 것입니다.

상태 모델을 만들어 보겠습니다. 코딩 예제의 경우 Git 리포지토리를 사용할 수 있습니다. 저는 시작하기 튜토리얼에서 생성한 것을 기반으로 구축 중입니다. 참조용으로 여기에 표시했습니다. 완료된 튜토리얼의 Github 저장소는 여기에 있습니다.

우리는

에서 Status.php를 생성할 것입니다. 상태 메시지를 게시하려면 사용자로부터 메시지 텍스트를 수집해야 합니다. 또한 공개 또는 비공개 게시를 위한 권한 필드도 생성하겠습니다. /hello/models/Status.php 으아악

규칙 기능에 주의하세요. Yii의 양식 유효성 검사에서는 이를 사용하여 사용자가 각 필드에 적절한 정보를 입력했는지 확인합니다. Yii는 사용자가 양식을 입력할 때 JavaScript를 사용하여 양식의 유효성을 검사합니다.

내가 만든

함수는 양식의 드롭다운 목록 요소에 사용됩니다. getPermissions()

이제 사용자가 텍스트 업데이트를 생성하고 볼 수 있는 컨트롤러를 만들어 보겠습니다.

컨트롤러

컨트롤러란 무엇인가요? Wikipedia에 따르면 "컨트롤러는 모델의 상태를 업데이트하기 위해 모델에 명령을 보낼 수 있습니다(예: 문서 편집). 또한 모델의 뷰 표시를 변경하기 위해 관련 뷰에 명령을 보낼 수도 있습니다." 페이지의 URL 경로는 컨트롤러를 호출하여 모델을 사용하여 페이지 데이터를 로드하고 보기를 사용하여 페이지를 렌더링합니다.

관련 기능을 하나의 컨트롤러에 논리적으로 그룹화하는 것이 가장 좋습니다. 컨트롤러의 다양한 메서드(액션이라고 함)가 각 기능을 구현합니다. 이는 일반적으로 특정 페이지에 해당합니다. 예를 들어 http://localhost:8888/hello/web/status/create는 우리가 만들고 있는 StatusController의 생성 작업을 호출합니다.

상태 관련 기능을 개발할 때 이러한 기능을 StatusController.php로 그룹화할 수 있습니다. 지금은 생성 기능만 빌드하겠습니다.

에서 StatusController.php를 생성합니다: /hello/controllers/ 으아악

양식 생성 작업은 일반적으로 모델 데이터를 호출한 다음 POST 작업의 일부인지 여부에 따라 파생됩니다. 그렇지 않은 경우 빈 양식이 표시됩니다. 게시된 데이터를 받으면 이를 확인하고 처리합니다. 우리의 경우 이는 뷰 파일을 계속 렌더링하는 것을 의미합니다.

조회수

뷰란 무엇인가요? Wikipedia에서는 "

Views모델에서 정보를 요청하고 사용자를 위한 출력 표현을 생성하는 데 사용됩니다." Yii에서 뷰는 PHP와 유사한 템플릿 언어를 사용하여 페이지 출력을 HTML로 렌더링하고 모델과 컨트롤러에 데이터가 전달되었습니다.

보기는 일반적으로 관련 컨트롤러와 관련된 단일 폴더에 위치합니다. 예를 들어 StatusController 보기는

폴더에 있습니다. views/status

Yii에서는 소위 부분 보기에 양식 코드가 포함되는 경우가 많습니다. 이러한 파일의 이름은 일반적으로 밑줄 접두사로 지정됩니다. 다른 보기에도 포함되어야 합니다. 이를 통해 페이지를 생성하고 업데이트하여 실제 양식 코드를 재사용할 수 있습니다.

먼저 양식을 렌더링하는 "Create" 뷰를 만듭니다. 그런 다음 게시한 상태 업데이트를 표시하기 위해 보기 보기도 생성합니다. 이는 실제 데이터베이스를 사용하여 데이터를 저장하고 검색할 때 다음 자습서에서 변경됩니다.

这是我们的 /hello/views/status.view.php 视图文件的一个简单示例，用于呈现发布的数据：

<?php
  use yii\helpers\Html;
?>

<h1>Your Status Update</strong></h1>
<p><label>Text</label>:</p>
  <?= Html::encode($model->text) ?>
<br /><br />
<p><label>Permissions</label>:</p>
<?php
echo $model->getPermissionsLabel($model->permissions);
?>

请注意视图文件是 HTML 和 PHP 的混合体。当控制器接收到发布的数据时，它会渲染上面的视图，显示用户提交的数据。

但是，现在我们来谈谈表单并构建创建表单视图文件。

表格

表单是我们在网络开发中每天用来收集用户数据的工具，通常用于将用户输入提交到数据库。 Yii 提供了大量的帮助程序代码来简化构建、验证、保护和发布表单数据的过程。在 Yii 中，表单是一种视图。

探索 MVC、表单和布局：Yii2 编程指南

以下是用于创建状态更新的示例表单：

<?php
  use yii\helpers\Html;
  use yii\widgets\ActiveForm;
  use app\models\Status;
?>
<?php $form = ActiveForm::begin();?>
    <?= $form->field($model, 'text')->textArea(['rows' => '4'])->label('Status Update'); ?>

    <?=
    $form->field($model, 'permissions')->dropDownList($model->getPermissions(), 
             ['prompt'=>'- Choose Your Permissions -']) ?>

    <div class="form-group">
        <?= Html::submitButton('Submit', ['class' => 'btn btn-primary']) ?>
    </div>

<?php ActiveForm::end(); ?>

Yii2 ActiveForm 小部件用于为我们的输入字段生成 HTML。请注意下拉列表如何调用 Status 模型 getPermissions 方法。

探索 MVC、表单和布局：Yii2 编程指南

单击“提交”按钮将返回到 StatusController 的创建操作。当接收到发布的数据时，它会呈现 view.php 文件而不是 create.php 表单文件。

以下是使用 view.php 呈现时视图文件的显示方式：

探索 MVC、表单和布局：Yii2 编程指南

接下来，让我们更新全局导航栏以包含状态创建表单的链接。

布局

布局是网站大多数外部重复元素的模板，例如 HTML 文档包装器、页眉、导航栏和页脚。由于这些对于网站的大多数页面来说都是通用的，因此它们在布局中构建一次，并且不会在代码中的任何地方重复。

如果你查看\hello\views\layouts\main.php，你可以看到外部布局的结构：

<?php
use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use app\assets\AppAsset;

/* @var $this \yii\web\View */
/* @var $content string */

AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?= Html::csrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body>

<?php $this->beginBody() ?>
    <div class="wrap">
        <?php
            NavBar::begin([
                'brandLabel' => 'My Company',
                'brandUrl' => Yii::$app->homeUrl,
                'options' => [
                    'class' => 'navbar-inverse navbar-fixed-top',
                ],
            ]);
            echo Nav::widget([
                'options' => ['class' => 'navbar-nav navbar-right'],
                'items' => [
                    ['label' => 'Home', 'url' => ['/site/index']],
                    ['label' => 'About', 'url' => ['/site/about']],
                    ['label' => 'Contact', 'url' => ['/site/contact']],
                    Yii::$app->user->isGuest ?
                        ['label' => 'Login', 'url' => ['/site/login']] :
                        ['label' => 'Logout (' . Yii::$app->user->identity->username . ')',
                            'url' => ['/site/logout'],
                            'linkOptions' => ['data-method' => 'post']],
                ],
            ]);
            NavBar::end();
        ?>

        <div class="container">
            <?= Breadcrumbs::widget([
                'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
            ]) ?>
            <?= $content ?>
        </div>
    </div>

    <footer class="footer">
        <div class="container">
            <p class="pull-left">&copy; My Company <?= date('Y') ?></p>
            <p class="pull-right"><?= Yii::powered() ?></p>
        </div>
    </footer>

<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>

视图主要代表网站的内部页面主体，即页眉和导航栏以及页脚开头之间的内容。当布局回显 $content:

时，它们就会被渲染

        <div class="container">
            <?= Breadcrumbs::widget([
                'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
            ]) ?>
            <?= $content ?>
        </div>

Yii 允许您为每个应用程序构建多个布局，尽管这并不总是必要的。这取决于您的应用程序。控制器提供默认布局，您可以针对任何给定操作覆盖此布局。如果您的控制器对相关活动进行逻辑分组，则用户界面很可能会对控制器内的所有操作使用相同的布局。

现在，让我们更新导航栏以包含带有“创建”操作的状态菜单。由于 Yii2 使用 Bootstrap 进行布局和样式，我们只需要告诉它创建一个 Bootstrap 下拉列表。

更新 Nav::widget 以拥有嵌套数组：

            echo Nav::widget([
                'options' => ['class' => 'navbar-nav navbar-right'],
                'items' => [
                    ['label' => 'Home', 'url' => ['/site/index']],
                    [
                       'label' => 'Status',
                       'items' => [
                            ['label' => 'Create', 'url' => ['/status/create']],
                        ],
                    ],                    
                    ['label' => 'About', 'url' => ['/site/about']],
                    ['label' => 'Contact', 'url' => ['/site/contact']],
                    Yii::$app->user->isGuest ?
                        ['label' => 'Login', 'url' => ['/site/login']] :
                        ['label' => 'Logout (' . Yii::$app->user->identity->username . ')',
                            'url' => ['/site/logout'],
                            'linkOptions' => ['data-method' => 'post']],
                ],
            ]);

这是您应该看到的内容：

探索 MVC、表单和布局：Yii2 编程指南

下一步是什么？

现在您已经了解了 Yii 的 MVC 架构在实践中如何工作，包括模型、视图、控制器、表单和布局，我们将为状态创建一个数据库模式，并使用 Yii 的脚手架生成器 Gii 来构建所有这对我们来说是自动的。事情会开始进展得更快一些。

如果您想知道下一个 Yii2 教程何时发布，请在 Twitter 上关注我 @reifman 或查看我的 Tuts+ 讲师页面。我的讲师页面将立即包含本系列的所有文章。

MVC, 양식 및 레이아웃 살펴보기: Yii2 프로그래밍 가이드

모델

表格

布局

下一步是什么？

相关链接

관련 기사