2021年6月18日 星期五

使用 PHP 實作 MVC 框架(二)

設定目標:
  • 使用 php 程式語言實作 MVC 框架!
  • 接續上一篇文章進行View 的實作!

實作 View 模組與檔案內容!
  1. 撰寫框架核心檢視類別,放置於 kernel 目錄下,例:View.php
    <?php
    
    namespace kernel;
    
    abstract class View {
      
      abstract public function __construct();
      abstract public function __destruct();
      
    }
    
  2. 撰寫測試用 indexView 檢視器,放置於 app\Views 目錄下,例:indexView.php
    <?php
    
    namespace App\Views;
    
    use kernel\View;
    
    class indexView extends View {
    
        public function __construct(){}
        public function show($user){
            print "Hello ,".$user;
        }
        public function __destruct(){}
    }
    
    
  3. 修改原來的 IndexController.php 檔案:
    <?php
    (追加下一行程式)
    use App\Views\indexView;
    (中間略過...)
    
    	//print $result;
        (new indexView())->show($result);
    
    
    PS:修改完後,重新整理網頁,應該會有資料產生!
  4. 修改 kernel.php ,將 $_SERVER 參數,傳向控制器!
    <?php
    (修改下列程式碼)
    (new $controller($uri[0]))->run();
    
  5. 修改 kernel 目錄下的 Controller.php :
    <?php
    namespace kernel;
    
    class Controller {
        protected $tmp_uri = array();
        protected $uri = array();
    
        public function __construct($parameter){
            $this->initUri($parameter); 
        }
            
        private function initUri($parameter){
            if (strlen(trim($parameter))){
                $this->tmp_uri = \explode('&',$parameter);
                foreach ($this->tmp_uri as $value) {
                    $info = (explode('=',$value));
                    $this->uri[$info[0]] = $info[1];
                }
            }
        }
        
        public function getUri(){
            return $this->uri;
        }
    }
    
  6. 修改 app/Controllers 目錄下的 IndexController.php :
    <?php
    (修改下列程式碼)
    class IndexController extends Controller {
       
        protected $paras;
    
        public function __construct($parameter){
           parent::__construct($parameter);
        }
    
        public function getUri(){
            $this->paras = parent::getUri();
            return $this->paras;
        }
        
        public function run(){
            var_dump($this->getUri());
            $username = new indexModel();
            $result = $username->printName();
            $view = new indexView();
            $view->show($result);
        }
    }
    
  7. 使用 http://hellomvc/?test=123 來進行測試,看看是否運作正常!
使用樣板引擎實作 View 模組!
  • 使用 composer 進行 twig 樣板引擎安裝
  • 使用 twig 設計 View 樣板
  1. 在 Windows 上,執行 Composer-Setup.exe 安裝 Composer!
  2. 利用 composer 安裝 twig 樣板引擎:
    cd c:\workspace\helloMVC
    composer require "twig/twig:^3.0"
    
  3. 修改 kernel 目錄下的 kernel.php,加入 Twig 樣板的 autoreload.php 檔案 :
    <?php
    namespace kernel;
    use config\Config;
    use config\Router;
    
    require_once(APP_PATH.'config/config.php');
    require_once(APP_PATH.'config/router.php');
    require_once(APP_PATH.'vendor/autoload.php');
    (其它略過.....)
    
  4. 修改 kernel 目錄下的 View.php,強迫使用 View 類別的子類別,必須使用 Twig 樣板引擎 :
    <?php
    namespace kernel;
    
    use Twig\Environment;
    use Twig\Loader\FilesystemLoader;
    
    class View {
        protected $twig;
        
        public function __construct($viewpath){
            $loader = new FilesystemLoader(APP_PATH."/app/Views".$viewpath);
            $this->twig = new Environment($loader);
            
        }
        public function getTwig(){
            return $this->twig;
        }
        public function __destruct(){}
        
    }
    
  5. 修改 app\Views 目錄下的 indexView.php,使用 Twig 樣板引擎,進行測試 :
    <?php
    namespace App\Views;
    
    use kernel\View;
    
    class indexView extends View {
        protected $twig;
        public function __construct($path){
            parent::__construct($path);
        }
        public function show($user){
            $twig = $this->getTwig();
            echo $twig->render('index.html.twig', ['name' => 'John Doe', 'occupation' => 'gardener']);
        }
        public function __destruct(){
        }
    }
    
  6. 修改 app\Controllers 目錄下的 indexController.php,進行測試 :
    <?php
    (前面略過)
        public function run(){
            $view = new indexView("/");
            $view->show($result);
        }
    (後面略過)
    
  7. 在 app\Views 目錄下,新增 index.html.twig ,進行測試:
    {{ name }} is a {{ occupation }}
    
  8. 使用瀏覽器查看網址: http://hellomvc/ ,可看到結果!

參考文獻:
  • https://zetcode.com/php/twig/