模板的布局、包含和继承

模板的布局、包含和继承_第1张图片

当我们的模板在主页的时候,显示的是下面这幅图这样。若切换到其他页面,可能会做一下修改,毕竟其他页面和主页肯定不一样。这个时候,就可以在这个base.html中,用{block name=""}{/block}将可能需要更改的地方先括起来。等到其他模板页面的时候,再进行修改。

模板的布局、包含和继承_第2张图片

看下图,就进行了修改

模板的布局、包含和继承_第3张图片

需要注意的是,“被继承的模板”中,block不能同名。也就是母版,用{block name="jojo"}{/block}括起来的地方,其他地方block不能再叫做jojo


模板的布局、包含和继承_第4张图片


模板的布局、包含和继承_第5张图片

上面取完名字,下面就开始创建文件,并且将base.html这个母版中的全部代码复制过来,删去没用的block

模板的布局、包含和继承_第6张图片

上面之所以这么做,是因为layout开启之后,有这么一个好处,就是只要用{__CONTENT__}放到想要修改的layout.html中,然后将index.html或者其他的模板文件全部清空,在index.html中写上任意内容,都可以转换成layout.html中做了{__CONTENT__}标记的地方,并且在网页中正常展示index.html中的内容。很神奇,但是有点绕人。

比如下面这幅图,就会将index.html页面中随便写的12121212字符串(只是写了字符串)自动转换到下图这个位置。然后index.html页面真正展示的是有layout.html效果的,但是内容又做了替换的页面

模板的布局、包含和继承_第7张图片
模板的布局、包含和继承_第8张图片

当然,index.html中,也可以写html标签,也可以用include。layout.html中虽然block不起作用,但是也是可以使用include的

模板的布局、包含和继承_第9张图片

当然,若想要更灵活的使用layout,那么可以像下面这么做

在layout.html中用变量

模板的布局、包含和继承_第10张图片

然后,巧妙的地方就在这里:

在控制器中,将对应每个模板的方法里面,都用$this->assign('title','index')适当的进行修改,就给每个方法对应的模板配合layout.html展现出不同的效果(此时page的几个页面里面都清空过一次了。只有一两行html代码)而此时下面经过这样的变量赋值分配,在打开不同的页面的时候,就会显示不同的标题了。

模板的布局、包含和继承_第11张图片

你可能感兴趣的:(模板的布局、包含和继承)