首页 > 解决方案 > 在 Laravel 7 和 graham-campbell/markdown 中为 Markdown 添加表格扩展

问题描述

我的应用程序基于 Laravel 7 并graham-campbell/markdown v13.1使用webuni/commonmark-table-extension v2.1.

如果在 html 中定义了一个表,我想使用一个将 Bootstrap css 类添加table table-striped table-bordered到呈现的 html 输出的类来扩展 markdown 环境。

不幸的是,我查看了很多示例并提出了以下不起作用的解决方案。

我在文件中定义扩展名App\Classes\Markdown\AddTableClassesExtension.php

<?php

namespace App\Classes\Markdown;

use League\CommonMark\ConfigurableEnvironmentInterface;
use League\CommonMark\Extension\ExtensionInterface;
use League\CommonMark\Extension\Table\Table;

class AddTableClassesExtension implements ExtensionInterface
{
    public function register(ConfigurableEnvironmentInterface $environment): void
    {
        $environment
            ->addBlockRenderer(Table::class, new \App\Classes\Markdown\AddTableClassesRenderer())
        ;
    }
}

我在文件中定义的实际渲染器App\Classes\Markdown\AddTableClassesRenderer

<?php

namespace App\Classes\Markdown;

use League\CommonMark\Block\Element\AbstractBlock;
use League\CommonMark\Block\Renderer\BlockRendererInterface;
use League\CommonMark\ElementRendererInterface;
use League\CommonMark\Extension\Table\Table;
use League\CommonMark\HtmlElement;

class AddTableClassesRenderer implements BlockRendererInterface {

public function render(AbstractBlock $block, ElementRendererInterface $htmlRenderer, bool $inTightList     = false)
    {
        if (!$block instanceof Table) {
            throw new \InvalidArgumentException('Incompatible block type: ' . get_class($block));
        }

        $attrs = [];

        // Add on the class we need:
        $attrs['class'] = $htmlRenderer->escape('table table-striped table-bordered', true);

        return new HtmlElement('table', $attrs, '', true);
    }

}

最后我将我的扩展添加到配置文件中config\markdown.php

'extensions' => [
        App\Classes\Markdown\AddTableClassesExtension::class,
        League\CommonMark\Ext\Table\TableExtension::class,
    ],

此设置创建 html 表,但它不会将 css 类添加到 table 属性。

当我调试它时,我什至没有在渲染器类中找到我的代码。为了进行测试,我使用以下方法和League\CommonMarkhttps://commonmark.thephpleague.com/1.5/extensions/tables/)文档中的表格:

public function testMarkdownExtension()
{

    $string = "th | th(center) | th(right)
               ---|:----------:|----------:
               td | td         | td";

    echo Markdown::convertToHtml($string);
}

我需要做什么才能让这个简单的扩展工作?

非常感谢您提前提供的帮助。

标签: laravelmarkdown

解决方案


借助问题请求:向图像添加类的能力。在 GitHub 上,我自己弄清楚了。

我重新定义了渲染器类

namespace App\Classes\Markdown;

use League\CommonMark\Event\DocumentParsedEvent;
use League\CommonMark\Ext\Table\Table;

class AddTableClassesRenderer {

    /**
     * @param DocumentParsedEvent $e
     *
     * @return void
     */
    public function __invoke(DocumentParsedEvent $e)
    {
        $walker = $e->getDocument()->walker();

        while ($event = $walker->next()) {
            $node = $event->getNode();
            if ($node instanceof Table) {
                $node->data['attributes'] = array('class' => 'table table-striped table-bordered');
            }
        }
    }

}

我改变了扩展类

namespace App\Classes\Markdown;

use League\CommonMark\ConfigurableEnvironmentInterface;
use League\CommonMark\Event\DocumentParsedEvent;
use League\CommonMark\Extension\ExtensionInterface;

class AddTableClassesExtension implements ExtensionInterface
{
    public function register(ConfigurableEnvironmentInterface $environment): void
    {
            $environment
                ->addEventListener(DocumentParsedEvent::class, new AddTableClassesRenderer());
        ;
    }
}

现在,该表包含适当的类。

<table class="table table-striped table-bordered">
   ...

推荐阅读