模版布局

  1. 默认情况下,不支持模版布局功能,需要在配置文件中开启;
    2. 在配置文件 template.php 中,配置开始模版布局功能;
    1. 'layout_on' => true,
  2. 此时,执行上一节课的模版控制器,会发现提示缺少模版 layout.html;
    4. 这个默认的布局文件,是可以更改的,位置和名字均可配置;
    1. 'layout_name' => 'public/layout',
  3. 我们清空上一节课 index.html 的模版代码,只写一个“主体”二字;
    6. 然后将所有的代码拷贝到 layout.html 的布局模版中去,删除本身的“主体”;
    7. 然后执行 index.html 模版时,怎么将主体嵌入到 layout.html 中去?
    8. 使用{CONTENT}类似魔术方法的标签来引入 index.html“主体”内容;
    1. {include file='public/header,public/nav' title='$title'
    2. keywords='这是一个模版!'/}
    3. {include file="../application/view/public/nav.html"/}
    4. {__CONTENT__}
    5. {include file='public/footer'/}
  4. 你可以更改{CONTENT},只要在配置文件中配置;
    1. 'layout_item' => '{__REPLACE__}'
  5. 再强调:再测试的时候,如果更改了配置文件,务必删除 temp 下编译文件再刷新;
    11. 上面说的是第一种,配置文件下来开启布局,而第二种方式则不需要开启直接使用;
    12. 首先,你必须关闭第一种配置,我这里就直接注释掉了,然后使用{layout}标签;
    13. 只要在 index.html 的最上面加上如下代码,即可实现模版布局;
    {layout name=”public/layout” repalce=’[CONTENT]’}
    14. 第三种,直接在控制器端执行 layout(true)方法即可,false 表示临时关闭;
    1. $this->view->engine->layout(true);
  6. 这种方法,虽然不需要配置文件开启,但如果不用默认的路径,还是要配置路径等;

    模版继承

  7. 模版继承是另一种布局方式,这种布局的思路更加的灵活;
    2. 首先,我们要创建一个 public/base.html 的基模版文件,文件名随意;
    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <title>{$title}</title>
    6. </head>
    7. <body>
    8. </body>
    9. </html>
  8. 创建一个新的方法 extend 载入新的模版 extend.html,然后加载基模版;
    1. {extend name='public/base'}
    2. {extend name='../application/view/public/base.html'}
  9. 对于模版基类里的变量{$title},直接在控制器设置传值即可;
    1. $this->assign('title', '模版');
  10. 在基模版 base.html 中,设置几个可替换的区块部分,{block}标签实现;
    1. {block name='nav'}nav{/block}
    2. {block name='include'}{include file='public:nav'}{/block}
    3. {block name='footer'} @ThinkPHP 版权所有 {/block}
  11. 在 extend.html 模版中,改变 nav,变成自己所需要的部分;
    1. {block name='nav'}
    2. <ol>
    3. <li>首页</li>
    4. <li>分类</li>
    5. <li>关于</li>
    6. </ol>
    7. {/block}
  12. 在 base.html 中,{include}可以加载内容,而在 extend.html 可以改变加载;
    {block name=’include’}{include file=’public:header’}{/block}
    8. 在 base.html 中已设置的内容,可以通过{block}加载到 extend.html 中;
    1. {block name='footer'}
    2. 本站来自: {__block__} | 翻版必究
    3. {/block}