第4章
第4章 · 初心者向け

View・画面表示

Viewは「見た目係」。渡されたデータを、安全にHTMLへします。

1. Viewとは

View=画面のHTMLを作るファイル

だいたい Action と同じ名前です。index() なら index.php

2. Controllerから渡された値を表示

// Controller
$this->set('title', '買い物');
<p><?= h($title) ?></p>

Controllerで set した名前が、Viewでは変数になります。

3. <?= ?> の意味

<?= $x ?>=「$x をここに出力」の短い書き方

長い書き方は <?php echo $x; ?> です。同じ意味です。

4. h() とは

h()=危険な文字を無害化する(エスケープ)
たとえ

ユーザーが入力した文字を、そのままページに貼ると「悪いスクリプト」が混ざることがあります。h() はそれを普通の文字として表示するガードです。

<?= h($todo->title) ?>
習慣にすること

画面に出す文字列には、基本いつも h() を付けましょう。

5. ifによる表示切り替え

完了なら「完了」、まだなら「未完了」のように出し分けます。

<?php if ($todo->done): ?>
  <span>完了</span>
<?php else: ?>
  <span>未完了</span>
<?php endif; ?>

6. foreachで一覧表示

foreach=リストを1件ずつ取り出す繰り返し
<ul>
<?php foreach ($todos as $todo): ?>
  <li><?= h($todo->title) ?></li>
<?php endforeach; ?>
</ul>

$todos が全体、$todo が今見ている1件です。

7. Form

CakePHPにはフォームを楽に書く道具(FormHelper)があります。

<?= $this->Form->create($todo) ?>
<?= $this->Form->control('title', ['label' => 'タイトル']) ?>
<?= $this->Form->button('保存') ?>
<?= $this->Form->end() ?>
いま知っておくこと

自分で <input> を全部書かなくても、Helper が用意してくれます。セキュリティ用のトークンも付きます。

8. Element

Element=使い回す部品テンプレート

ヘッダーや「1件分のカード」など、同じHTMLを何度も書かないために使います。

<?= $this->element('todo_item', ['todo' => $todo]) ?>

9. Layout

Layout=全ページ共通の外枠(枠・ナビ・フッター)

各ページの中身は、この外枠の真ん中に差し込まれます。

10. エラー情報を画面に表示

「保存しました」「失敗しました」などの短い伝言です。

// Controller
$this->Flash->success('保存しました');
$this->Flash->error('失敗しました');
<?= $this->Flash->render() ?>

第4章 やってみよう

EXERCISE
  1. 配列を foreach で <li> 表示するViewを書く
  2. 出力すべてに h() を付ける
  3. タイトル入力の FormHelper を写経する