README

此包允许您在Laravel应用程序中注册自定义“标签辅助工具”。这些辅助工具可以修改HTML代码。

例如，而不是这样

<form method="post">
    <input type="hidden" name="_method" value="DELETE">
    <input type="hidden" name="_token" value="csrf-token">    
</form>

您可以使用自定义标签辅助工具将此代码转换为这样

<form csrf method="delete">

</form>

安装

您可以通过composer安装此包

composer require beyondcode/laravel-tag-helper

该包将自动注册自身。

使用

您可以通过创建一个新类并从 BeyondCode\TagHelper\Helper 类扩展来创建自己的Tag Helper。在这个类中，您可以定义辅助工具应在哪些HTML元素和属性上触发

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomTagHelper extends Helper
{
    protected $targetAttribute = 'custom';

    protected $targetElement = 'div';

    public function process(HtmlElement $element)
    {
        // Manipulate the DOM element
    }
}

要使用和应用此标签辅助工具，您需要注册它。通常，您会在 AppServiceProvider boot() 方法或您自己的服务提供程序中这样做。

TagHelper::helper(CustomTagHelper::class);

由于您只注册自定义标签辅助工具的类名，您可以在自定义辅助工具类内部使用依赖注入。

将辅助工具绑定到HTML元素和属性

在您的自定义标签辅助工具中，您可以使用 $targetAttribute 和 $targetElement 属性来指定您想绑定此辅助工具的HTML元素（div、form、a等）和属性（<div custom="value />、<form method="post">等）。

如果您没有提供自己的 targetElement，此包将使用一个 * 作为通配符来针对具有特定属性的所有元素，如下所示

class CustomTagHelper extends Helper
{
    protected $targetAttribute = 'my-attribute';
    
    // ...
    
}

此标签辅助工具将为具有 my-attribute 属性的每个HTML元素调用。

操作DOM元素

一旦您的标签辅助工具成功匹配一个或多个HTML元素，您的标签辅助工具的 process 方法将被调用。

在这个方法中，您可以操作HTML元素。

可用功能

更改HTML元素标签

在这个例子中，我们将我们的辅助工具绑定到HTML元素 <my-custom-link href="/"></my-custom-link>。然后，在过程方法中，我们可以将内部标签更改为 a 以呈现为链接。

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomLink extends Helper
{
    protected $targetElement = 'my-custom-link';

    public function process(HtmlElement $element)
    {
        $element->setTag('a');
    }
}

操作属性

您还可以添加、编辑或删除HTML元素的属性。

在这个例子中，我们将我们的辅助工具绑定到具有自定义 route 属性的所有链接标签。然后，我们更新链接的 href 属性，删除 route 属性并添加新的 title 属性。

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomLink extends Helper
{
    protected $targetAttribute = 'route';
    
    protected $targetElement = 'a';

    public function process(HtmlElement $element)
    {
        $element->setAttribute('href', route($element->getAttribute('route')));
        
        $element->removeAttribute('route');
        
        $element->setAttribute('title', 'This is a link.');
    }
}

操作外部/内部文本

您的自定义标签辅助工具可以操作当前元素内部或外部的HTML。

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomLink extends Helper
{
    protected $targetAttribute = 'add-hidden-field';
    
    protected $targetElement = 'form';

    public function process(HtmlElement $element)
    {
        $element->removeAttribute('add-hidden-field');
        
        $element->appendInnerText('<input type="hidden" name="hidden" />');
        
        // $element->prependInnerText('');
        // $element->setInnerText('');
    }
}

向您的标签辅助工具传递变量

您可以将属性值传递给标签助手，就像通常将属性传递给HTML元素一样。由于您的标签助手修改会被缓存，因此在修改属性值时，您应始终返回有效的Blade模板输出。

您不能直接访问标签助手内部的变量内容，只能获取属性字符串表示。

例如，要获取method属性的属性值

<form method="post"></form>

您可以使用助手内的getAttribute方法来访问此数据

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomForm extends Helper
{
    protected $targetElement = 'form';

    public function process(HtmlElement $element)
    {
        $formMethod = $element->getAttribute('method');
    }
}

如果您想编写Blade输出，有时您需要知道用户是传递了一个变量或函数调用，还是字符串值。为了区分，用户可以通过使用冒号作为前缀来传递变量数据。

如果您想将此属性输出到Blade模板中，您可以使用getAttributeForBlade方法，它将返回属性的转义字符串表示——或者在冒号前缀的情况下，返回未转义的表示。

例如

<a route="home">Home</a>

<?php

namespace BeyondCode\TagHelper\Helpers;

use BeyondCode\TagHelper\Helper;
use BeyondCode\TagHelper\Html\HtmlElement;

class CustomForm extends Helper
{
    protected $targetElement = 'a';

    protected $targetAttribute = 'route';

    public function process(HtmlElement $element)
    {
        $element->setAttribute('href', "{{ route(" . $element->getAttributeForBlade('route') . ") }}");
        
        $element->removeAttribute('route');
    }
}

这将输出

<a href="{{ route('home') }}">Home</a>

但如果你传递一个像这样的动态参数

<a :route="$routeVariable">Home</a>

这将输出

<a href="{{ route($routeVariable) }}">Home</a>

这样，您就无需手动处理转义和检测动态变量。

内置助手

此包附带了一些有用的标签助手。

CSRF助手

只需将csrf属性添加到任何form元素中，即可自动将其添加到Laravel CSRF字段中。

<form csrf method="post">

</form>

将变为

<form method="post">
    <input type="hidden" name="_token" value="csrf-token">    
</form>

注意事项

csrf需要与其他属性在同一行。

// this works
<form
    csrf action="/posts"
    class="mt-8>
    
// this doesn't work
<form
    csrf
    action="/posts"
    class="mt-8>

表单方法助手

当您的form包含除GET或POST之外的method时，助手将自动向您的表单添加一个具有正确值的_method隐藏字段。

<form method="delete">

</form>

将变为

<form method="post">
    <input type="hidden" name="_method" value="DELETE">    
</form>

链接

当您的标签包含route属性时，此助手将更改href以指向适当的路由。您还可以提供route-parameters属性，以将额外的参数传递给路由生成。

示例

<a route="home">Home</a>

<a route="profile" :route-parameters="[$user->id()]">Home</a>

测试

composer test

变更日志

有关最近更改的更多信息，请参阅变更日志。

贡献

有关详细信息，请参阅贡献指南。

安全

如果您发现任何与安全相关的问题，请通过电子邮件marcel@beyondco.de与我们联系，而不是使用问题跟踪器。

鸣谢

许可

MIT许可（MIT）。有关更多信息，请参阅许可文件。

beyondcode / laravel-tag-helper

维护者

详细信息