5.2 实例演示二

优质

小牛编辑

127浏览

2023-12-01

学习目标：

通过这个简单的实例，更好地了解布局视图(layout)、挂件(widget)的运用，更深刻地理解DoitPHP的视图机制。

创建文件：

1、创建IndexController(建议使用DoitPHP Tools),文件路径：application/controllers/IndexController.php。内容如下：

/**
 * DoitPHP 演示实例二
 *
 * @author tommy
 * @copyright Copyright (C) www.doitphp.com All rights reserved.
 * @version $Id: Index.php 1.0 2020-11-10 18:55:39Z tommy $
 * @package Controller
 * @since 1.0
 */
namespace controllers;

use doitphp\core\Controller;

class IndexController extends Controller {

    /**
     * 文章列表页(首页)
     *
     * @access public
     * @return void
     */
    public function indexAction() {
        $articleUrl = $this->getActionUrl('article');
        $this->assign('articleUrl', $articleUrl);
        $this->display();
    }

    /**
     * 文章内容页
     *
     * @access public
     * @return void
     */
    public function articleAction() {
        //获取文章Id
        $articleId = $this->get('id', 1);
        $this->assign('articleId', $articleId);
        $this->display();
    }

    /**
     * 前函数(数据初始化)
     *
     * @access protected
     * @return boolean
     */
    protected function _init() {

        //设置布局视图
        $this->setLayout('main');
    }
}

2、创建布局视图main.php, 文件路径为：application/views/layouts/main.php。内容如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>演示实例二:视图机制</title>
</head>

<body>
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td height="90" colspan="2" align="center">DoitPHP演示实例二</td>
  </tr>
  <tr>
    <td height="40" colspan="2"><?php $this->widget('mainMenu'); ?></td>
  </tr>
  <tr>
    <td width="760" height="580" align="left" valign="top">
    <?php echo $viewContent; ?>
    </td>
    <td width="200" align="center" bgcolor="#CCCCCC">广告位</td>
  </tr>
  <tr>
    <td height="60" colspan="2" align="center">版权信息 2017 </td>
  </tr>
</table>
</body>
</html>

3、创建挂件mainMenuWidget,文件路径为：application/widgets/mainMenuWidget.php,内容如下：

/**
 * 主菜单(挂件)
 *
 * @author tommy
 * @copyright Copyright (C) www.doitphp.com 2016 All rights reserved.
 * @version $Id: mainMenu 1.0 2020-11-11 02:12:02Z tommy $
 * @package Widget
 * @since 1.0
 */
namespace widgets;

use doitphp\core\Widget;

class mainMenuWidget extends Widget {

    /**
     * main method
     *
     * @access public
     *
     * @param array $params 参数
     *
     * @return void
     */
    public function renderContent($params = null) {
        
        $this->assign(array(
        'actionName'     => App::getActionName(),
        ));

        $this->display();
    }
}

其视图文件为：mainMenu.php, 文件路径为：application/views/widgets/mainMenu.php,内容如下：

<?php if($actionName == 'index'){ ?>
<span style="color:#336699"><strong>首页</strong></span>
<?php } else { ?>
<a href="<?php echo $this->getActionUrl('index'); ?>">首页</a>
<?php } ?>

<?php if($actionName == 'article'){ ?>
<span style="color:#336699"><strong>文章</strong></span>
<?php } else { ?>
<a href="<?php echo $this->getActionUrl('article'); ?>">文章</a>
<?php } ?>

创建视图文件，从IndexController的内容看，有两个Action类方法，故需要创建两个视图文件，路径分别为：application/views/index/index.php, application/views/index/article.php。

index.php文件内容如下：

<ul>
<li><a href="<?php echo $articleUrl; ?>/?id=1">文章1</a></li>
<li><a href="<?php echo $articleUrl; ?>/?id=2">文章2</a></li>
<li><a href="<?php echo $articleUrl; ?>/?id=3">文章3</a></li>
</ul>

article.php文件内容如下：

<div>文章ID：<span style="color:#c40000;"><?php echo $articleId; ?></span></div>

到这里这个实例已经完成了，在浏览器地址栏里访问这个项目的入口文件，你会看页首页为一个文章列表内容。点击文章列表，再点击下主菜单那些链接。细细体会，你就会领悟到布局视图、挂件的妙用。

练习题：

将IndexController中的indexAction类方法中的$this->display(), 如果改成$this->render();后，运行看下输出的页面内容是什么？这时就你会知道 Controller基类中提供的视图操作类方法:display()、render()它们之间的区别了。