maxonfjvipon/phtml

纯面向对象的HTML构建模板库，具有函数式接口

维护者

详细信息

github.com/maxonfjvipon/phtml

源代码

问题

安装: 0

依赖: 0

建议者: 0

安全: 0

星标: 3

关注者: 2

分支: 1

开放问题: 5

0.0.3 2022-11-07 22:17 UTC

Requires

Requires (Dev)

MIT b551e4cbd4d0581ecbf5fd39f4c205034caeb1da

  • Max Trunnikov <mtrunnikov.woop@gmail.com>

This package is auto-updated.

Last update: 2024-09-08 02:17:03 UTC

README

phtml是一个纯面向对象的HTML构建模板库，为PHP提供函数式接口，灵感来源于JavaTags和ScalaTags。

EO principles respected here DevOps By Rultor.com

Composer codecov Hits-of-Code License Tag

这个片段

use Maxonfjvipon\Phtml\at;
use function Maxonfjvipon\Phtml\{html5, attr, head, meta, title, link, text};

html5(attr([at::lang => 'en']),
  head(
    meta(attr([at::http_equiv => 'Content-Type', at::content => 'text/html', at::charset => 'UTF-8'])),
    title(text("Title")),
    link(attr(["href" => "/css/custom.css", "rel" => "stylesheet"]))
  )
)->asString();

将被转换成这个HTML

<!DOCTYPE html>
<html lang='en'>
  <head>
    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
    <title>Title</title>
    <link href='/css/custom.css' rel='stylesheet'/>
 </head>
</html>

入门

要求

  • PHP >= 8.0

安装

composer require maxonfjvipon/phtml

示例

基本

库提供了所有HTML标签作为函数，只有一个例外 - <var></var>。PHP不允许你创建名为var的函数，因为这个单词是保留的。所以为了创建<var></var>标签，请使用_var函数

(如果您知道更优雅的方式来处理这个<var></var> - 请创建一个问题)

此代码

use function Maxonfjvipon\Phtml\{html5, head, body, div, _var, text};

html5(
  head(),
  body(
    div(
      _var(text("Hello world!"))
    )
  )
)->asString();

将渲染为这个HTML

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div>
      <var>Hello world!</var>
    </div>
  </body>
</html>

属性

要向您的标签添加属性，您应使用attr函数。函数接受一个参数数组。数组可以有'key' => 'value'和仅'value'元素

use function Maxonfjvipon\Phtml\{a, attr};

a(attr(['href' => '/some/url', "download"]))->asString(); // <a href='/some/url' download></a>

只有当属性在第一个位置时才会渲染属性。其他位置的属性将被忽略。

use function Maxonfjvipon\Phtml\{a, attr};

div(attr(['class' => 'div']), div())->asString(); // <div class='div'><div></div></div>
div(div(), attr(['class' => 'div']))->asString(); // <div><div></div></div>

库提供了辅助类Maxonfjvipon\Phtml\at，其中包含所有现有的HTML属性作为常量。您可以使用它这样

use Maxonfjvipon\Phtml\at;
use function Maxonfjvipon\Phtml\{html5, attr};

html5(attr([at::lang => "en"]))->asString(); // <!DOCTYPE html><html lang='en'></html>

注意！

at::class将返回您\Maxonfjvipon\Phtml\at而不是预期的'class'（因为::class被PHP保留）

(如果可以覆盖这个::class并且您知道如何做 - 请创建一个问题)

要从at获取'class'字符串，您可以这样做at::_class或at::$class。或者您可以直接手动编写

use Maxonfjvipon\Phtml\at;
use function Maxonfjvipon\Phtml\{html5, attr};

attr([at::class => 'main'])->asString(); // \Maxonfjvipon\Phtml\at='main'
attr(['class' => 'main'])->asString(); // class='main'
attr([at::$class => 'main'])->asString(); // class='main'
attr([at::_class => 'main'])->asString(); // class='main'

辅助函数

自定义标签

您可以使用两个辅助函数创建自定义标签：paired和unpaired

use function Maxonfjvipon\Phtml\{unpaired, paired};

unpaired('somebody', attr(['class' => 'custom unpaired']))->asString(); // <somebody class='custom unpaired'/>
paired('somebody', attr(['class' => 'custom paired']))->asString(); // <somebody class='custom paired'></somebody>

如果您想添加许多标签（例如从数组中），您可以使用tags函数

use function Maxonfjvipon\Phtml\{tags, div, unpaired, link};

tags(div(), unpaired('my'), link())->asString(); // <div></div><my/><link/>

字符串、标签和文本

库基于ElegantElephant中的Maxonfjvipon\ElegantElephant\Txt类。因此，除了属性外，每个成对标签都可以接受其他标签、字符串和文本。

此标签

use Maxonfjvipon\ElegantElephant\TxtOf;
use function Maxonfjvipon\Phtml\{div, link};

div(attr(['class' => 'main']),
  link(), // other tag
  TxtOf::str('text'), // Text
  text("alias"), // wrap string to Maxonfjvipon\ElegantElephant\Txt
  "just string",
)->asString();

将被转换成

<div class='main'>
  <link/>\n
  text\n
  alias\n
  just string\n
</div>

导入

如果您想使用所有可用的标签和函数，您必须添加此导入。

(如果您知道如何使整个导入更短 - 请创建一个问题)

请注意，一些标签函数与内置PHP函数具有相同的名称（例如\header()、\time()等）。因此，在使用它们之前，请确保您已经导入了这些函数。

use function Maxonfjvipon\Phtml\{
    text,
    unpaired,
    paired,
    a,
    abbr,
    address,
    article,
    aside,
    audio,
    b,
    bdi,
    ddo,
    blockquote,
    body,
    button,
    canvas,
    caption,
    cite,
    code,
    colgroup,
    data,
    datalist,
    dd,
    del,
    dfn,
    div,
    dl,
    dt,
    em,
    fieldset,
    figcaption,
    figure,
    footer,
    form,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    head,
    header,
    i,
    iframe,
    ins,
    kbd,
    label,
    legend,
    li,
    main,
    map,
    mark,
    meter,
    nav,
    noscript,
    object,
    ol,
    optgroup,
    option,
    output,
    p,
    pre,
    progress,
    q,
    rb,
    rp,
    rt,
    rtc,
    ruby,
    s,
    samp,
    script,
    section,
    select,
    small,
    span,
    strong,
    style,
    sub,
    sup,
    table,
    tbody,
    td,
    template,
    textarea,
    tfoot,
    th,
    thead,
    time,
    title,
    tr,
    u,
    ul,
    video,
    attr,
    tags,
    br,
    html5,
    area,
    base,
    col,
    command,
    embed,
    hr,
    img,
    input,
    link,
    meta,
    param,
    source,
    track,
    wbr,
    _var,
    xmp
};

贡献

叉取仓库，进行更改，发送拉取请求。为了避免挫折，在发送您的拉取请求之前，请运行

$ ./pre-push.sh

并确保您没有错误。