使用視圖 · Phalcon 3.4中文手冊

[TOC] # 使用視圖視圖表示應用程序的用戶界面。視圖通常是帶有嵌入式PHP代碼的HTML文件，這些代碼執行僅與數據表示相關的任務。視圖處理向Web瀏覽器或用于從您的應用程序發出請求的其他工具提供數據的工作。 `Phalcon\Mvc\View` 和 `Phalcon\Mvc\View\Simple` 負責管理MVC應用程序的視圖層。 ## 將視圖與控制器集成一旦特定控制器完成其循環，Phalcon就會自動將執行傳遞給視圖組件。視圖組件將在views文件夾中查找名稱與執行的最后一個控制器的名稱相同的文件夾，然后查找名為最后執行的操作的文件。例如，如果請求URL *http://127.0.0.1/blog/posts/show/301*，Phalcon將按如下方式解析URL： | 服務地址 | 127.0.0.1 | | ----------------- | --------- | | Phalcon 目錄 | blog | | Controller | posts | | Action | show | | Parameter | 301 | 調度程序將查找`PostsController`及其動作`showAction`。此示例的簡單控制器文件： ```php <?php use Phalcon\Mvc\Controller; class PostsController extends Controller { public function indexAction() { } public function showAction($postId) { // Pass the $postId parameter to the view $this->view->postId = $postId; } } ``` `setVar()` 方法允許我們按需創建視圖變量，以便可以在視圖模板中使用它們。上面的示例演示了如何將`$postId`參數傳遞給相應的視圖模板。 ## 分層渲染 `Phalcon\Mvc\View` 支持文件層次結構，是Phalcon中視圖呈現的默認組件。此層次結構允許公共布局點（常用視圖），以及定義相應視圖模板的控制器命名文件夾。默認情況下，此組件使用PHP本身作為模板引擎，因此視圖應具有`.phtml`擴展名。如果views目錄是*app/views*，則視圖組件將自動查找這3個視圖文件。 | 名稱 | 文件 | 描述 | | ----------------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | 動作視圖 | app/views/posts/show.phtml | 這是與操作相關的視圖。只有在執行`show`動作時才會顯示它。 | | 控制器布局 | app/views/layouts/posts.phtml | 這是與控制器相關的視圖。它僅針對控制器“posts”內執行的每個動作顯示。布局中實現的所有代碼都將重用于此控制器中的所有操作。 | | 主布局 | app/views/index.phtml | 這是針對應用程序中執行的每個控制器或操作顯示的主要操作。 | 您不需要實現上面提到的所有文件。`Phalcon\Mvc\View`簡單地移動到文件層次結構中的下一個視圖級別。如果實現了所有三個視圖文件，則將按如下方式處理它們： ```php  <h3>This is show view!</h3> <p>I have received the parameter <?php echo $postId; ?></p> ``` ```php  <h2>This is the "posts" controller layout!</h2> <?php echo $this->getContent(); ?> ``` ```php  <html> <head> <title>Example</title> </head> <body> <h1>This is main layout!</h1> <?php echo $this->getContent(); ?> </body> </html> ``` 注意調用方法`$this->getContent()`的行。此方法指示`Phalcon\Mvc\View`在哪里注入層次結構中執行的上一個視圖的內容。對于上面的示例，輸出將是： .. figure:: ../_static/img/views-1.png :align: center 請求生成的HTML將是： ```php  <html> <head> <title>Example</title> </head> <body> <h1>This is main layout!</h1>  <h2>This is the "posts" controller layout!</h2>  <h3>This is show view!</h3> <p>I have received the parameter 101</p> </body> </html> ``` ### 使用模板模板是可用于共享公共視圖代碼的視圖。它們充當控制器布局，因此您需要將它們放在layouts目錄中。模板可以在布局之前呈現（使用`$this->view->setTemplateBefore()`），也可以在布局之后渲染（`this->view->setTemplateAfter()`）。在以下示例中，模板（`layouts/common.phtml`）在控制器布局（`layouts/posts.phtml`）之后渲染： ```php <?php use Phalcon\Mvc\Controller; class PostsController extends Controller { public function initialize() { $this->view->setTemplateAfter('common'); } public function lastAction() { $this->flash->notice( 'These are the latest posts' ); } } ``` ```php  <!DOCTYPE html> <html> <head> <title>Blog's title</title> </head> <body> <?php echo $this->getContent(); ?> </body> </html> ``` ```php  <ul class='menu'> <li><a href='/'>Home</a></li> <li><a href='/articles'>Articles</a></li> <li><a href='/contact'>Contact us</a></li> </ul> <div class='content'><?php echo $this->getContent(); ?></div> ``` ```php  <h1>Blog Title</h1> <?php echo $this->getContent(); ?> ``` ```php  <article> <h2>This is a title</h2> <p>This is the post content</p> </article> <article> <h2>This is another title</h2> <p>This is another post content</p> </article> ``` 最終輸出如下： ```php  <!DOCTYPE html> <html> <head> <title>Blog's title</title> </head> <body>  <ul class='menu'> <li><a href='/'>Home</a></li> <li><a href='/articles'>Articles</a></li> <li><a href='/contact'>Contact us</a></li> </ul> <div class='content'>  <h1>Blog Title</h1>  <article> <h2>This is a title</h2> <p>This is the post content</p> </article> <article> <h2>This is another title</h2> <p>This is another post content</p> </article> </div> </body> </html> ``` 如果我們使用了`$this->view->setTemplateBefore('common')`，那么這將是最終輸出： ```php  <!DOCTYPE html> <html> <head> <title>Blog's title</title> </head> <body>  <h1>Blog Title</h1>  <ul class='menu'> <li><a href='/'>Home</a></li> <li><a href='/articles'>Articles</a></li> <li><a href='/contact'>Contact us</a></li> </ul> <div class='content'>  <article> <h2>This is a title</h2> <p>This is the post content</p> </article> <article> <h2>This is another title</h2> <p>This is another post content</p> </article> </div> </body> </html> ``` ### 控制渲染級別如上所示，`Phalcon\Mvc\View`支持視圖層次結構。您可能需要控制視圖組件生成的渲染級別。方法`Phalcon\Mvc\View::setRenderLevel()`提供此功能。可以從控制器或從上級視圖層調用此方法以干擾渲染過程。 ```php <?php use Phalcon\Mvc\View; use Phalcon\Mvc\Controller; class PostsController extends Controller { public function indexAction() { } public function findAction() { // This is an Ajax response so it doesn't generate any kind of view $this->view->setRenderLevel( View::LEVEL_NO_RENDER ); // ... } public function showAction($postId) { // Shows only the view related to the action $this->view->setRenderLevel( View::LEVEL_ACTION_VIEW ); } } ``` 可用的渲染級別為： | 類常量 | 描述 | 順序 | | ----------------------- | ------------------------------------------------------------------------ |:-----:| | `LEVEL_NO_RENDER` | 表示避免生成任何類型渲染。 | | | `LEVEL_ACTION_VIEW` | 生成與操作關聯的視圖。 | 1 | | `LEVEL_BEFORE_TEMPLATE` | 在控制器布局之前生成模板。 | 2 | | `LEVEL_LAYOUT` | 生成渲染到控制器布局。 | 3 | | `LEVEL_AFTER_TEMPLATE` | 在控制器布局之后生成到模板的渲染。 | 4 | | `LEVEL_MAIN_LAYOUT` | 生成顯示到主布局。文件`views/index.phtml` | 5 | ### 禁用渲染級別您可以永久或暫時禁用渲染級別。如果在整個應用程序中根本不使用某個級別，則可以永久禁用該級別： ```php <?php use Phalcon\Mvc\View; $di->set( 'view', function () { $view = new View(); // Disable several levels $view->disableLevel( [ View::LEVEL_LAYOUT => true, View::LEVEL_MAIN_LAYOUT => true, ] ); return $view; }, true ); ``` 或者在應用程序的某些部分暫時禁用： ```php <?php use Phalcon\Mvc\View; use Phalcon\Mvc\Controller; class PostsController extends Controller { public function indexAction() { } public function findAction() { $this->view->disableLevel( View::LEVEL_MAIN_LAYOUT ); } } ``` ### 選擇視圖如上所述，當 `Phalcon\Mvc\View` 由`Phalcon\Mvc\Application`管理時，渲染的視圖是與最后一個控制器和執行的操作相關的視圖。您可以使用 `Phalcon\Mvc\View::pick()` 方法覆蓋它： ```php <?php use Phalcon\Mvc\Controller; class ProductsController extends Controller { public function listAction() { // Pick 'views-dir/products/search' as view to render $this->view->pick('products/search'); // Pick 'views-dir/books/list' as view to render $this->view->pick( [ 'books', ] ); // Pick 'views-dir/products/search' as view to render $this->view->pick( [ 1 => 'search', ] ); } } ``` ### 禁用視圖如果您的控制器在視圖中沒有產生任何輸出（或者甚至沒有輸出），您可以禁用視圖組件以避免不必要的處理： ```php <?php use Phalcon\Mvc\Controller; class UsersController extends Controller { public function closeSessionAction() { // Close session // ... // Disable the view to avoid rendering $this->view->disable(); } } ``` 或者，您可以返回`false`以產生相同的效果： ```php <?php use Phalcon\Mvc\Controller; class UsersController extends Controller { public function closeSessionAction() { // ... // Disable the view to avoid rendering return false; } } ``` 您可以返回`response`對象以避免手動禁用視圖： ```php <?php use Phalcon\Mvc\Controller; class UsersController extends Controller { public function closeSessionAction() { // Close session // ... // A HTTP Redirect return $this->response->redirect('index/index'); } } ``` ## 簡單的渲染 `Phalcon\Mvc\View\Simple` 是 `Phalcon\Mvc\View`的替代組件。它保留了`Phalcon\Mvc\View`的大部分哲學，但缺乏文件層次結構，事實上，它是對應文件的主要特征。該組件允許開發人員控制何時呈現視圖及其位置。此外，該組件可以利用模板引擎（如`Volt`等）中可用的視圖繼承。必須在服務容器中替換默認組件： ```php <?php use Phalcon\Mvc\View\Simple as SimpleView; $di->set( 'view', function () { $view = new SimpleView(); $view->setViewsDir('../app/views/'); return $view; }, true ); ``` 必須在`Phalcon\Mvc\Application`中禁用自動渲染（如果需要）： ```php <?php use Exception; use Phalcon\Mvc\Application; try { $application = new Application($di); $application->useImplicitView(false); $response = $application->handle(); $response->send(); } catch (Exception $e) { echo $e->getMessage(); } ``` 要渲染視圖，必須顯式調用`render`方法，指示要顯示的視圖的相對路徑： ```php <?php use Phalcon\Mvc\Controller; class PostsController extends Controller { public function indexAction() { // Render 'views-dir/index.phtml' echo $this->view->render('index'); // Render 'views-dir/posts/show.phtml' echo $this->view->render('posts/show'); // Render 'views-dir/index.phtml' passing variables echo $this->view->render( 'index', [ 'posts' => Posts::find(), ] ); // Render 'views-dir/posts/show.phtml' passing variables echo $this->view->render( 'posts/show', [ 'posts' => Posts::find(), ] ); } } ``` 這與`Phalcon\Mvc\View` 不同，它的`render()` 方法使用控制器和動作作為參數： ```php <?php $params = [ 'posts' => Posts::find(), ]; // Phalcon\Mvc\View $view = new \Phalcon\Mvc\View(); echo $view->render('posts', 'show', $params); // Phalcon\Mvc\View\Simple $simpleView = new \Phalcon\Mvc\View\Simple(); echo $simpleView->render('posts/show', $params); ``` ## 使用Partials 部分模板是將渲染過程分解為更簡單，更易于管理的塊的另一種方法，可以由應用程序的不同部分重用。使用partial，您可以移動代碼以將特定的響應片段呈現給自己的文件。使用partials的一種方法是將它們視為子例程的等價物：作為一種將細節移出視圖的方法，以便更容易理解代碼。例如，您可能有一個如下所示的視圖： ```php <div class='top'><?php $this->partial('shared/ad_banner'); ?></div> <div class='content'> <h1>Robots</h1> <p>Check out our specials for robots:</p> ... </div> <div class='footer'><?php $this->partial('shared/footer'); ?></div> ``` `partial()` 方法接受第二個參數作為變量/參數數組，它們只存在于partial的范圍內： ```php <?php $this->partial('shared/ad_banner', ['id' => $site->id, 'size' => 'big']); ?> ``` ## 將值從控制器傳輸到視圖 `Phalcon\Mvc\View`在每個控制器中都可以使用視圖變量（`$this->view`）。您可以使用該對象通過使用`setVar()` 方法從控制器操作直接將變量設置到視圖。 ```php <?php use Phalcon\Mvc\Controller; class PostsController extends Controller { public function indexAction() { } public function showAction() { $user = Users::findFirst(); $posts = $user->getPosts(); // Pass all the username and the posts to the views $this->view->setVar('username', $user->username); $this->view->setVar('posts', $posts); // Using the magic setter $this->view->username = $user->username; $this->view->posts = $posts; // Passing more than one variable at the same time $this->view->setVars( [ 'username' => $user->username, 'posts' => $posts, ] ); } } ``` 將在視圖中創建具有 `setVar()` 的第一個參數名稱的變量，以供使用。變量可以是任何類型，從簡單的字符串，整數等變量到更復雜的結構，如數組，集合等。 ```php <h1> {{ username }}'s Posts </h1> <div class='post'> <?php foreach ($posts as $post) { echo '<h2>', $post->title, '</h2>'; } ?> </div> ``` ## 緩存視圖片段有時，當您開發動態網站并且其中某些區域不經常更新時，請求之間的輸出完全相同。`Phalcon\Mvc\View` 提供緩存部分或整個渲染輸出以提高性能。 `Phalcon\Mvc\View` 與 `Phalcon\Cache` 集成，提供了一種緩存輸出片段的簡便方法。您可以手動設置緩存處理程序或設置全局處理程序： ```php <?php use Phalcon\Mvc\Controller; class PostsController extends Controller { public function showAction() { // Cache the view using the default settings $this->view->cache(true); } public function showArticleAction() { // Cache this view for 1 hour $this->view->cache( [ 'lifetime' => 3600, ] ); } public function resumeAction() { // Cache this view for 1 day with the key 'resume-cache' $this->view->cache( [ 'lifetime' => 86400, 'key' => 'resume-cache', ] ); } public function downloadAction() { // Passing a custom service $this->view->cache( [ 'service' => 'myCache', 'lifetime' => 86400, 'key' => 'resume-cache', ] ); } } ``` 當我們沒有定義緩存的key時，組件使用控制器名稱的[MD5](http://php.net/manual/en/function.md5.php)哈希和當前以`controller/view`格式呈現的視圖自動創建一個鍵。為每個操作定義一個鍵是一個好習慣，這樣您就可以輕松識別與每個視圖關聯的緩存。當View組件需要緩存某些內容時，它將從服務容器中請求緩存服務。此服務的服務名稱約定是`viewCache`： ```php <?php use Phalcon\Cache\Frontend\Output as OutputFrontend; use Phalcon\Cache\Backend\Memcache as MemcacheBackend; // Set the views cache service $di->set( 'viewCache', function () { // Cache data for one day by default $frontCache = new OutputFrontend( [ 'lifetime' => 86400, ] ); // Memcached connection settings $cache = new MemcacheBackend( $frontCache, [ 'host' => 'localhost', 'port' => '11211', ] ); return $cache; } ); ``` >[warning] 前端必須始終為`Phalcon\Cache\Frontend\Output`，并且服務viewCache必須在服務容器（DI）中注冊為始終打開（不共享）。使用視圖時，可以使用緩存來防止控制器需要在每個請求上生成視圖數據。為此，我們必須使用密鑰唯一地標識每個緩存。首先，我們驗證緩存不存在或已過期，以使計算/查詢在視圖中顯示數據： ```php <?php use Phalcon\Mvc\Controller; class DownloadController extends Controller { public function indexAction() { // Check whether the cache with key 'downloads' exists or has expired if ($this->view->getCache()->exists('downloads')) { // Query the latest downloads $latest = Downloads::find( [ 'order' => 'created_at DESC', ] ); $this->view->latest = $latest; } // Enable the cache with the same key 'downloads' $this->view->cache( [ 'key' => 'downloads', ] ); } } ``` [PHP替代站點](https://github.com/phalcon/php-site)是實現片段緩存的示例。 ## 模板引擎模板引擎可幫助設計人員在不使用復雜語法的情況下創建視圖。Phalcon包括一個名為`Volt`的強大而快速的模板引擎。`Phalcon\Mvc\View`許您使用其他模板引擎而不是普通的PHP或Volt。使用不同的模板引擎通常需要使用外部PHP庫進行復雜的文本解析，以便為用戶生成最終輸出。這通常會增加應用程序將使用的資源數量。如果使用外部模板引擎，`Phalcon\Mvc\View`提供完全相同的視圖層次結構，并且仍然可以更加努力地訪問這些模板中的API。該組件使用適配器，這些幫助Phalcon以統一的方式與這些外部模板引擎對話，讓我們看看如何進行這種集成。 ### 創建自己的模板引擎適配器有許多模板引擎，您可能希望集成或創建自己的模板引擎。開始使用外部模板引擎的第一步是為它創建一個適配器。模板引擎適配器是一個類，它充當`Phalcon\Mvc\View`和模板引擎本身之間的橋梁。通常它只需要實現兩個方法：`__construct()` 和`render()`。第一個接收`Phalcon\Mvc\View`實例，該實例創建引擎適配器和應用程序使用的DI容器。方法 `render()` 接受視圖文件的絕對路徑和使用`$this->view->setVar()`設置的視圖參數。您可以在必要時閱讀或要求它。 ```php <?php use Phalcon\DiInterface; use Phalcon\Mvc\Engine; class MyTemplateAdapter extends Engine { /** * Adapter constructor * * @param \Phalcon\Mvc\View $view * @param \Phalcon\Di $di */ public function __construct($view, DiInterface $di) { // Initialize here the adapter parent::__construct($view, $di); } /** * Renders a view using the template engine * * @param string $path * @param array $params */ public function render($path, $params) { // Access view $view = $this->_view; // Access options $options = $this->_options; // Render the view // ... } } ``` ### 更改模板引擎您可以完全替換模板引擎，也可以同時使用多個模板引擎。方法 `Phalcon\Mvc\View::registerEngines()` 接受包含定義模板引擎的數據的數組。每個引擎的關鍵是一個擴展，有助于區分彼此。與特定引擎相關的模板文件必須具有這些擴展名。使用`Phalcon\Mvc\View::registerEngines()`定義模板引擎的順序定義了執行的相關性。如果`Phalcon\Mvc\View`找到兩個具有相同名稱但擴展名不同的視圖，則它只會呈現第一個視圖。如果要為應用程序中的每個請求注冊模板引擎或其中一組。您可以在創建視圖服務時注冊它： ```php <?php use Phalcon\Mvc\View; // Setting up the view component $di->set( 'view', function () { $view = new View(); // A trailing directory separator is required $view->setViewsDir('../app/views/'); // Set the engine $view->registerEngines( [ '.my-html' => 'MyTemplateAdapter', ] ); // Using more than one template engine $view->registerEngines( [ '.my-html' => 'MyTemplateAdapter', '.phtml' => 'Phalcon\Mvc\View\Engine\Php', ] ); return $view; }, true ); ``` [Phalcon Incubator](https://github.com/phalcon/incubator/tree/master/Library/Phalcon/Mvc/View/Engine)上有幾個模板引擎可用的適配器 ## 在View中注入服務每個執行的視圖都包含在`Phalcon\Di\Injectable` 實例中，可以輕松訪問應用程序的服務容器。以下示例說明如何使用具有框架約定的URL編寫jQuery [ajax請求](http://api.jquery.com/jQuery.ajax/)。通過訪問具有相同名稱的屬性，在視圖中注入服務`url`（通常是`Phalcon\Mvc\Url`）： ```js <script type='text/javascript'> $.ajax({ url: '<?php echo $this->url->get('cities/get'); ?>' }) .done(function () { alert('Done!'); }); </script> ``` ## 獨立組件 Phalcon中的所有組件都可以單獨用作*膠水*組件，因為它們彼此松散耦合： ### 分層渲染在獨立模式下使用`Phalcon\Mvc\View`可以在下面演示： ```php <?php use Phalcon\Mvc\View; $view = new View(); // A trailing directory separator is required $view->setViewsDir('../app/views/'); // Passing variables to the views, these will be created as local variables $view->setVar('someProducts', $products); $view->setVar('someFeatureEnabled', true); // Start the output buffering $view->start(); // Render all the view hierarchy related to the view products/list.phtml $view->render('products', 'list'); // Finish the output buffering $view->finish(); echo $view->getContent(); ``` 還提供了一個簡短的語法： ```php <?php use Phalcon\Mvc\View; $view = new View(); echo $view->getRender( 'products', 'list', [ 'someProducts' => $products, 'someFeatureEnabled' => true, ], function ($view) { // Set any extra options here $view->setViewsDir('../app/views/'); $view->setRenderLevel( View::LEVEL_LAYOUT ); } ); ``` ### 簡單的渲染在獨立模式下使用`Phalcon\Mvc\View\Simple`可以在下面演示： ```php <?php use Phalcon\Mvc\View\Simple as SimpleView; $view = new SimpleView(); // A trailing directory separator is required $view->setViewsDir('../app/views/'); // Render a view and return its contents as a string echo $view->render('templates/welcomeMail'); // Render a view passing parameters echo $view->render( 'templates/welcomeMail', [ 'email' => $email, 'content' => $content, ] ); ``` ## 視圖事件 `Phalcon\Mvc\View` 和 `Phalcon\Mvc\View\Simple` 能夠將事件發送到`EventsManager`（如果存在）。使用類型`view`觸發事件。返回布爾值false時的某些事件可能會停止活動操作。支持以下事件： | 事件名稱 | 觸發 | Can stop operation? | | ---------------- | --------------------------------------------- |:-------------------:| | beforeRender | 在開始渲染過程之前觸發 | Yes | | beforeRenderView | 在渲染現有視圖之前觸發 | Yes | | afterRenderView | 在渲染現有視圖之后觸發 | No | | afterRender | 完成渲染過程后觸發 | No | | notFoundView | 未找到視圖時觸發 | No | 以下示例演示如何將偵聽器附加到此組件： ```php <?php use Phalcon\Events\Event; use Phalcon\Events\Manager as EventsManager; use Phalcon\Mvc\View; $di->set( 'view', function () { // Create an events manager $eventsManager = new EventsManager(); // Attach a listener for type 'view' $eventsManager->attach( 'view', function (Event $event, $view) { echo $event->getType(), ' - ', $view->getActiveRenderPath(), PHP_EOL; } ); $view = new View(); $view->setViewsDir('../app/views/'); // Bind the eventsManager to the view component $view->setEventsManager($eventsManager); return $view; }, true ); ``` 以下示例顯示如何使用[Tidy](http://www.php.net/manual/en/book.tidy.php)創建一個清理/修復渲染過程生成的HTML的插件： ```php <?php use Phalcon\Events\Event; class TidyPlugin { public function afterRender(Event $event, $view) { $tidyConfig = [ 'clean' => true, 'output-xhtml' => true, 'show-body-only' => true, 'wrap' => 0, ]; $tidy = tidy_parse_string( $view->getContent(), $tidyConfig, 'UTF8' ); $tidy->cleanRepair(); $view->setContent( (string) $tidy ); } } // Attach the plugin as a listener $eventsManager->attach( 'view:afterRender', new TidyPlugin() ); ```