Yii框架分析(九)——视图渲染流程

MVC架构中,View主要是用于展示信息的。Yii中的视图层文件由2部分组成:布局视图、部分视图。web系统的大部分页面都存在相同的元素:logo、菜单、foot栏等,我们把这些相同的元素组成的视图文件称为布局视图,一般web系统需要2个布局,即前台布局和后台布局,前台布局是给用户看的,后台布局是给管理员看的。每个页面所独有的部分视图称为部分视图。

可以使用上图进行描述,我们将菜单栏、导航栏和Footer栏放到布局文件中,即所有页面复用一个布局文件,然后每个页面(Action)有各自的部分视图文件。
接下来看一下视图文件的存放路径。WebApp可以配置视图文件路径和布局文件路径同时还会指定一个默认的布局文件;每个Controller的视图文件存放在WebApp指定的视图路径下,以Controller的名字职位后缀,Controller还可以指定自己使用哪个布局文件。
WebApp成员属性 说明
viewPath 用于指定视图文件路径,所有的视图文件必须在这个文件下
默认protected/views
layoutPath 用于指定布局文件路径,所有的布局文件必须在这个文件下
默认protected/views/layouts,该路径下有:main.php、column.php
viewPath 用于指定系统视图文件路径,默认protected/views/system
layout 指定默认使用的布局文件,默认为main

比如当前正在执行PostController的modifyAction,PostController指定使用column布局,那么这个请求所使用的布局文件为protected/views/layouts/column.php,视图文件为protected/views/post/modify.php。
视图层中还有2个重要的概念:客户端脚本组件、Widget。
客户端脚本组件:该组件用于管理客户端脚本(javascript和css),可以通过该组件向视图中添加javascript和css,客户端脚本组件统一管理这些代码,在页面输出的最后一步对客户端脚本(javascript和css)进行渲染。
Widget:又称小物件,通过Widget可以对页面进行模块化,Widget可以看成是一个没有布局的控制器。通过Widget可以把公用的页面元素进行复用,比如:Menu Widget、列表Widget、表格Widget、分页Widget等等。

视图层的渲染分3个步骤完成:
Step1:渲染部分视图,即渲染每个页面各自特有的视图片断;
Step2:将渲染布局视图,即即渲染每个页面共有的页面元素,同时将Step1的结果插入到布局视图中。在Step1和Step2中,可能还需要渲染Widget,比如日历Widget、菜单Widget等。这2个步骤中可以注册自己使用了哪些js和css;
Step3:渲染js和css。将前2步注册的js和css添加到html页面的制定位置。

由于加载顺序的原因,导致的结果是在部分视图中使用registerCssFile或者registerScriptFile导入的css文件或者js文件会出现在布局视图文件中注册的css或js文件之前,造成页面样式及动态效果的混乱,如何解决这个问题呢?

其实很简单,那就是在protected/components/Controller.php中重写init方法,将布局视图中的注册全局js或css文件的方法定义在init方法中即可:

public function init(){
    Yii::app()->clientScript->registerCoreScript(‘jquery‘);
    Yii::app()->clientScript->registerCssFile(Yii::app()->baseUrl . ‘/css/style.css‘);
    parent::init();
}

这样就可以保证jquery.js和style.css文件在所有其他js及css文件之前定义在head标签中。

时间: 2024-08-01 14:40:20

Yii框架分析(九)——视图渲染流程的相关文章

YII框架分析笔记2:组件和事件行为管理

Yii是一个基于组件.用于开发大型 Web 应用的高性能 PHP 框架.CComponent几乎是所有类的基类,它控制着组件与事件的管理,其方法与属性如下,私有变量$_e数据存放事件(evnet,有些地方叫 hook),$_m数组存放行为(behavior). 组件管理 YII是一个纯oop框架,很多类中的成员变量的受保护或者私有的,CComponent中利用php中的魔术方法__get(),__set()来访问和设置属性,但这些方法的作用远不指这些.下面用__get()来说明 [php] vi

Yii框架分析(五)——再谈CComponent基础类

这篇文章可作为<Yii框架分析(二)——CComponent类剖析>的补充. CComponent类为YII框架的基于组件和事件驱动编程提供了基础,YII框架中的大部分类都将CComponent类作为基类.CComponent类为它的子类提供3个特性: 1.成员变量扩展通过定义两个成员函数(getXXX/setXXX)来定义一个成员变量,比如:public function getText() {…}public function setText {…}这样就相当于定义了一个$text成员变量

YII框架分析笔记1:YII执行流程

yii整体执行流程直观,具体由以下步骤: 1.程序入口文件index.php加载yii框架引导程序(bootstrap)文件yii.php,加载配置文件以及其他自定义配置. 2.yii.php中Yii类继承了YiiBase,主要封装框架的一些通用方法,比如自动加载.创建组件.核心类路径映射.记录日志以及调试等,YiiBase.php中注册自动加载方法.另外Yii类预留可以自定义一些方法作为扩展. 3.回到index.php,Yii::createWebApplication($config),创

YII框架分析笔记6:视图

YII框架使用的view是在原生的php模板上进行扩展的.CController中对视图的渲染有多种方法: render($view,$data=null,$return=false)//连同layout一起渲染 renderPartial($view,$data=null,$return=false,$processOutput=false)//不渲染layout renderText($text,$return=false)//渲染静态内容和layout renderDynamic($cal

YII框架分析笔记5:控制器和动作

CBaseController是控制器和挂件的基类,主要提供了视图渲染,挂件,剪辑.片段缓存等方法,CController是所有应用中自定义控制器的基类. 创建动作 [php] view plaincopy public function run($actionID) { if(($action=$this->createAction($actionID))!==null) { if(($parent=$this->getModule())===null) $parent=Yii::app()

YII框架分析笔记3:表单模型和验证

表单模型CFormModel绝大部分继承CModelCModel,由于表模型数据不需要持久化,所以主要在验证操作上.下面以框架脚手架生成的网站登录为例说明表单模型. [php] view plaincopy //模型中的验证规则 public function rules() { return array( array('username, password', 'required'), array('rememberMe', 'boolean'), array('password', 'aut

YII框架分析笔记10:日志

yii框架中日志组件记录的等级5类,在CLogger已通过常量定义: const LEVEL_TRACE='trace'; const LEVEL_WARNING='warning'; const LEVEL_ERROR='error'; const LEVEL_INFO='info'; const LEVEL_PROFILE='profile'; CLogger为所有日志写入和获取提供接口,通过日志路由管理类CLogRouter将日志分发到不同日志展现或存储介质中. 日志组件配置 [php]

YII框架分析笔记8:CDataProvider

CDataProvider,顾名思义,数据提供者,它提供了三个抽象方法(fetchData,.fetchKeys 和 calculateTotalItemCount),分别为调用不同数据结构的数据提供了获取数据.获取键值.获取数量的,接口,在YII框架 中,CActiveDataProvider.CArrayDataProvider.CSqlDataProvider是它的子类,除了提供数据之外, 他还提供分页和排序功能.下面以获取数据fetchData()为例 CActiveDataProvid

Yii框架分析(六)——Yii的别名管理与对象创建管理

YiiBase类为YII框架的运行提供了公共的基础功能:别名管理与对象创建管理. 在创建一个php的对象时,需要先include这个类的定义文件,然后再new这个对象.在不同环境下(开发环境/测试环境/线上环境),apache的webroot路径的配置可能不一样,所以这个类的定义文件的全路径就会不同,Yii框架通过YiiBase的别名管理来解决了这个问题. 在创建对象时,需要导入对应类的定义,经常需要使用这5个函数:include().include_once().require().requi