寫出第一個View

有了基礎 controller 以後,讓我們建立簡單的第一個 View 吧。在此我們先用 eample 當做 View 的名稱,比較好理解其功能。

建立 View 物件

元件的 View 通常放在 views 目錄中,並且每個 view 又有自己的資料夾,所以我們要建立一個 views/example/view.html.php 檔案:

<?php
// administrator\components\com_blog\views\example\view.html.php

use Joomla\CMS\MVC\View\HtmlView;

defined('_JEXEC') or die;

class BlogViewExample extends HtmlView
{
    public function display($tpl = null)
    {
        echo 'Example View Display.';
    }
}
 

可以大略記得這個命名規則,{元件名稱}View{View 名稱},controller 與 model 都是用同樣的命名方法。

接著回去更改之前的 BlogController

<?php
// administrator\components\com_blog\controller.php

use Joomla\CMS\MVC\Controller\BaseController;

defined('_JEXEC') or die;

class BlogController extends BaseController
{
    public function display($cachable = false, $urlparams = array())
    {
        $view = $this->getView('Example', 'html');

        $view->display();
    }

    public function flower()
    {
        echo 'Flower';
    }
}
 

在 display() 裡面新增兩行,分別取出 View 並執行 View 的 display()。要注意 getView() 的第二個參數 html 對應剛剛的 view.html.php。意味著我們如果要建立 view.json.php,則必須用 getView('XXX', 'json') 來取得,第二個參數是不可省略的,否則會抓不到 view 跳錯誤訊息。

現在重新整理瀏覽器,應該會看到如下畫面。

p-2014-09-02-6.jpg

使用 HTML Template

接著我們要使用 HTML 來 render 頁面,先在 example view 下面的 tmpl 建立此檔案:

<?php
// administrator\components\com_blog\views\example\tmpl\default.php

defined('_JEXEC') or die;
?>
<h1>Example Template</h1>
 

然後更改 BlogViewExample 呼叫 parent 的 display()

<?php
// administrator\components\com_blog\views\example\view.html.php

use Joomla\CMS\MVC\View\HtmlView;

defined('_JEXEC') or die;

class BlogViewExample extends HtmlView
{
    public function display($tpl = null)
    {
        parent::display($tpl);
    }
}
 

這樣 parent 就會幫我們 render 出 template 內的內容了

p-2014-09-02-7.jpg

在 Template 內使用動態變數

我們可以在 View 中預備一些動態變數,然後插入在 Template 內,使用方法如下:

<?php
// administrator\components\com_blog\views\example\view.html.php

use Joomla\CMS\Date\Date;
use Joomla\CMS\MVC\View\HtmlView;

defined('_JEXEC') or die;

class BlogViewExample extends HtmlView
{
    public function display($tpl = null)
    {
        $this->title = 'Example View & Template';
        $this->content = 'Go go let\'s go~~~!!!!';
        $this->date = new Date('now', 'Asia/Taipei');

        parent::display($tpl);
    }
}
 
<?php
// administrator\components\com_blog\views\example\tmpl\default.php

defined('_JEXEC') or die;
?>
<h1><?php echo $this->title; ?></h1>
<p><?php echo $this->content; ?> in <?php echo $this->date->format('Y-m-d', true); ?></p>
 

結果如下,$this 在 Template 中就代表 View 物件本身。

p-2014-09-02-9.jpg


本章節的教學內容可以在 GitHub 上找到: Code / Commits

ukash birim çevirme saç ekimi estetik