phpffcms/ffcms-templex

为 ffcms 定制的简单 html 模板引擎,基于原生的 php-html 语法

1.3.2 2022-08-19 12:49 UTC

This package is auto-updated.

Last update: 2024-09-19 17:21:12 UTC


README

Templex - 基于 php plates 框架构建的本地 php 模板系统:thephpleague/plates。Templex 在 phpffcms 中作为基本模板引擎使用,附带一系列 html 辅助函数,使得快速构建 html 代码输出成为可能。

安装

使用 composer

composer require phpffcms/ffcms-templex

用法

要查看完整示例,请查看 /example 目录。

初始化

在此您可以查看模板系统初始化的简单示例

$loader = require __DIR__ . '/vendor/autoload.php';

// initialize template engine
$tpl = new \Ffcms\Templex\Engine(__DIR__ . '/tpl');
// load default ffcms html helpers as extensions
$tpl->loadDefaultExtensions();

// render /tpl/block.body.php example
echo $tpl->render('block/body', ['test' => 'some value']);

使用布局

任何模板系统的主要功能是布局。Plates 提供了在模板中使用布局的完整功能

$this->layout('path/to/file', ['var' => 'value']);

部分扩展

部分允许您使用块覆盖功能创建动态模板。要了解部分扩展的工作方式,请查看简单示例

/tpl/block/body.php

<?php
$this->layout('layout', ['title' => 'My first title']);
?>

<?php $this->start('body') ?>
<h1>Hello, world!</h1>
<p>This is my first template</p>
<?php $this->stop(); ?>

/tpl/layout.php

<doctype html>
<html lang="en">
<head>
    <title><?= $title ?></title>
<body>
<?= $this->section('body'); ?>
</body>
</head>
</html>

初始化和执行 $tpl->render('block/body') 后,输出将如下

<doctype html>
<html lang="en">
<head>
    <title>My first title</title>
<body>
<h1>Hello, world!</h1>
<p>This is my first template</p>
</body>
</head>
</html>

layout.php 中渲染后的 body 部分,将接受从 start('body') ... stop() 部分返回的结果。您可以使用 ->push('name') 而不是 ->start('name') 来进行多部分扩展。

Html 辅助函数

Templex 提供了一个简单且清晰的基于 php 的 html 代码生成器。在任何应用程序的开发过程中,构建表格、列表、网格和表单的 html 输出是主要部分。

在本节中,您将看到 html 代码生成器辅助函数的主要功能。

列表

要绘制简单的列表,您应使用 $this->listing('type', [properties]),然后调用 li([items], [properties]) 来添加每个 <li></li> 元素。

列表可以内联使用或作为命名工厂对象。内联对象的使用适用于应“立即”显示的预定义元素

echo $this->listing('ul')
    ->li('item 1')
    ...
    ->li('item n')
    ->display()

命名对象可以定义用于更复杂的使用。例如 - 在循环中添加列表元素

$listing = $this->listing('ul');

for ($i = 0; $i < 100; $i++) {
    $listing->li('Item #' . $i);
}

echo $listing->display();

包含一些“魔法”的完整示例

echo $this->listing('ul', ['class' => 'my-listing'])
    ->li('Text item')
    ->li(['text' => 'Google link', 'link' => ['https://google.com']])
    ->li(['text' => 'Local link', 'link' => ['controller/action', ['id' => 1]], 'properties' => ['class' => 'li-item']])
    ->display();

将编译为输出

<ul class="my-listing">
  <li>Text item</li>
  <li><a href="https://google.com">Google link</a></li>
  <li class="li-item"><a href="https:///controller/action/1">Local link</a></li>
</ul>

表格

表格常用于显示结构化数据。Templex 提供了绘制简单且快速的表格的辅助函数。要绘制表格,您应使用 $this->table([properties]) 实例,然后实现 thead ->head([properties], [items]) 功能,tbody ->row([items], order) 项目,最后调用 ->display() 获取 html 输出。

与列表一样,表格可以内联使用或以命名风格使用(注意!以下代码是象征性的)

// inline call:
echo $this->table([properties])
    ->head([properties], [titles])
    ->row([items1])
    ->row([items2])
    ->display();
    
 // named call:
$table = $this->table([properties]);
$table->head([properties], [titles])
for ($i = 0; $i < 100; $i++) {
    $table->row([elements]);
}
echo $table->display();

因此,请查看完整的示例

echo $this->table(['class' => 'table'])
    ->head(['class' => 'table-header'], [
        ['text' => 'column1'],
        ['text' => 'column2'],
        ['text' => 'column3'],
    ])
    ->row([
        ['text' => 'row 1, <strong>column1</strong>', 'html' => true], // html allowed
        ['text' => 'row 1, column2', 'properties' => ['class' => 'alert alert-danger']],
        ['text' => 'row 1, column3']
    ])
    ->row([
        ['text' => 'row 2, column1'],
        ['text' => 'row 2, <em>column2</em>'], // html not allowed!
        ['text' => 'row 2, column3'],
        'properties' => ['class' => 'alert alert-success']
    ])
    ->display();

导致输出

<table class="table">
    <thead class="table-header">
    <tr><th>column1</th>
        <th>column2</th>
        <th>column3</th>
    </tr>
    </thead>
    <tbody>
        <tr>
            <td>row 1, <strong>column1</strong></td>
            <td class="alert alert-danger">row 1, column2</td>
            <td>row 1, column3</td>
        </tr>
        <tr class="alert alert-success">
            <td>row 2, column1</td>
            <td>row 2, &lt;em&gt;column2&lt;/em&gt;</td>
            <td>row 2, column3</td>
        </tr>
    </tbody>
</table>   

如果您想在 text 属性中使用 html 语法,请将 'html' = true 传递到项目数组中。

选择列

表格辅助函数提供在表格列索引处显示多个复选框的功能。如果要在每个列元素中添加复选框输入字段,请使用选择化

$this->table([properties])
    ->selectize(index, name)

注意,应使用 ->selectize() 在调用 ->head()->row() 之前。

可排序列

如果您想要在表格中对数据进行排序,您可以使用表格构建的排序辅助函数。排序将在定义的列索引处添加带有命名链接的上/下箭头。

$this->table([properties])
    ->sortable([
        0 => 'getname' // will build ?getname=1 and ?getname=2 links as asc/desc sorting query
    ])

表单

表单辅助函数提供了快速构建、样式化和显示表单字段的功能。