OctoberCMS-5-部件

Partials

partials 我们这里简称【部件】,是可以重复使用的Twig标记块。可以用于网站的任何位置。比如页眉页脚或者其他Ajax内容。

partials模板文件存储在模板目录的partials子目录中。扩展名是htm。最简单的例子:

<p>This is a partial</p>

partials 的配置部分是可选的,其中可选参数description,用于给后端用户提供功能说明。

description = "Demo partial"
==
<p>This is a partial</p>

在配置部分可以定义组件,将在后续的组件部分学习。

部件的渲染

渲染部件的方式:{% partial “partial-name” %} 。这里只有一个必须的参数,就是【文件名】这里的文件名是指文件的名称部分,不包含扩展名部分。如果在子目录中,则需要写明路径。部件可以被页面、布局或者其他部件使用。

下面就是一个部件引用了另一个部件。

<div class="sidebar">
    {% partial "sidebar-contacts" %}
</div>

将变量传递给部件

部件的一个强大的功能是,我们可以给部件传递变量参数。比如我们拥有一个渲染博客列表的部件,我们可以将帖子的集合传递给中国博客列表部件。这时候这个部件就可以使用到多个不同的页面或者布局中。传递方式:部件名称 后面 跟 部件的变量名和传递值得变量名:

<div class="sidebar">
    {% partial "blog-posts" posts=posts %}
</div>

当然也可以一次指定多个变量,进行传递

<div class="sidebar">
    {% partial "sidebar-contacts" city="Vancouver" country="Canada" %}
</div>

在部件的内部,可以和使用其他标记变量一样的,使用这些变量。

<p>Country: {{ country }}, city: {{ city }}.</p>

动态部件

部件和页面一样,也可以使用Twig标记。

部件的执行生命周期

onStart函数在部件渲染之前和部分执行之前执行。

onEnd函数在部件渲染之前和部件执行之后执行。

在onStart和onEnd函数中,您可以将变量注入到Twig环境中。使用array notation将变量传递给页面:

==
function onStart()
{
    $this['hello'] = "Hello world!";
}
==
<h3>{{ hello }}</h3>

声明周期限制

由于部件的实例化时间比较晚,在页面渲染期间,部件的生命周期会受到一些限制。

  1. AJax事件没有被注册,不能执行。
  2. 生命周期函数不能返回任何值。
  3. 表单常规的POST操作在部件渲染的时候执行。

一般来讲,部件中的组件一般设计为基本组件,用来渲染一些没有复杂处理的情况,比如按钮等。

    原文作者:Tianby
    原文地址: https://segmentfault.com/a/1190000015290092
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞