Components
Components这里我们称之为组件。
组件是可以配置的构建元素。可以附加到Pages(页面)、Layouts(布局)、Partials(部件)中。组件是October的核心特性。每个组件都可以对网站的功能进行扩展。组件可以在页面上输出HTML代码,但是这不是主要的,组件的一个重要功能是处理Ajax请求、处理表单提交回调,处理页面执行周期。允许向页面注入变量或者实现网站安全性。
介绍
启用组件,如果是后端管理系统中,可以选择组件面板,将组件拖动添加到页面、部件和布局中。如果是采用文本编辑模式,则可以将组件的对应模板的名称添加到对应的模板的配置部分。比如:下面的例子演示了如何将todolist组件添加到页面中。
title = "Components demonstration"
url = "/components"
[demoTodo]
maxItems = 20
==
...
当您引用Components时,它会自动创建一个与Components名称匹配的Page变量(在前面的示例中为demoTodo)。提供HTML标记的Components可以使用标记在Page上呈现{% component %},如下所示:
{% component 'demoTodo' %}
如果具有相同名称的两个组件分配给Page和Layout,Page中的组件将覆盖布局中的组件。
组件的别名
如果有两个注册Components的名称相同,则可以使用完全限定的名称引用组件,并为其指定一个别名:
[October\Demo\Components\Todo demoTodoAlias]
maxItems = 20
第一个参数是类名,第二个参数是注入到Page时使用的组件的别名。如果您指定了组件的别名,那么在引用组件时,可以页面代码中的任何地方使用。下一个示例引用Components别名:
{% component 'demoTodoAlias' %}
允许给同一个组件定义多个别名,以实现在同一个页面上使用一个组件的多个实例。
[demoTodo todoA]
maxItems = 10
[demoTodo todoB]
maxItems = 20
组件使用外部属性值
默认情况下,属性值在定义组件的配置部分会进行初始化,这时候属性值是静态的,如下所示:
[demoTodo]
maxItems = 20
==
...
不过有一个办法可以使用外部的参数为组件属性进行初始化。可以是URL参数,Partial部件参数。使用{{ paramName }}从外部变量加载的值的语法:
[demoTodo]
maxItems = {{ maxItems }}
==
...
假设在上面的示例中,组件 demoTodo 在部件中使用,则部件的变量maxItems**将为组件的变量进行初始化:
{% partial 'my-todo-partial' maxItems='10' %}
如果是URL参数,则使用的方式略有不同:使用{{ :paramName }}名称以冒号(:)开头的语法
[demoTodo]
maxItems = {{ :maxItems }}
==
...
组件对应的页面在配置部分,应该具有相应的URL参数定义:
url = "/todo/:maxItems"
在October的后端,您可以使用Inspector工具将外部值分配给Components属性。在Inspector中,您不需要使用大括号输入参数名称。Inspector中的每个字段在右侧都有一个图标,用于打开外部参数名称编辑器。输入paramName部分变量或:paramNameURL参数的参数名称。
自定义默认标记
http://octobercms.com/docs/cm…
后续补充