README

Yii 视图 Twig 渲染器

该包是 Yii 视图渲染库的扩展。此扩展提供了一个 ViewRender，允许您使用 Twig 视图模板引擎。

要求

PHP 8.0 或更高版本。

安装

可以使用 Composer 安装此包

composer require yiisoft/view-twig

通用用法

在您的应用程序中，您应指定 Twig 的配置（默认为 config/packages/yiisoft/view-twig/common.php）

use Psr\Container\ContainerInterface;
use Twig\Environment;
use Twig\Loader\FilesystemLoader;
use Yiisoft\Aliases\Aliases;
use Yiisoft\View\Twig\Extensions\YiiTwigExtension;
   
return [
    Environment::class => static function (ContainerInterface $container): Environment {
        $loader = new FilesystemLoader($container
            ->get(Aliases::class)
            ->get('@views'));

        $twig = new Environment($loader, [
            'cache' => $container
                ->get(Aliases::class)
                ->get('@runtime/cache/twig'),
            'charset' => 'utf-8',
        ]);

        $twig->addExtension(new YiiTwigExtension($container));
        return $twig;
    },
];

并且覆盖 WebView 的配置（默认为 config/packages/yiisoft/view/web.php）

use Psr\Container\ContainerInterface;
use Psr\EventDispatcher\EventDispatcherInterface;
use Twig\Environment;
use Yiisoft\Aliases\Aliases;
use Yiisoft\View\WebView;
use Yiisoft\View\Twig\ViewRenderer;

/** @var array $params */
   
return [
    //...
    WebView::class => static function (ContainerInterface $container) use ($params): WebView {
        $webView = new WebView(
            $container
                ->get(Aliases::class)
                ->get('@views'),
            $container->get(EventDispatcherInterface::class),
        );

        $webView = $webView
            ->withDefaultExtension('twig')
            ->withRenderers(['twig' => new ViewRenderer($container->get(Environment::class))])
        ;

        $webView->setCommonParameters($params['yiisoft/view']['commonParameters']);
        return $webView;
    },
    //...
];

模板

所有在常规模板中的变量也都在 twig 模板中可用。

get(string $id); 函数允许您获取容器设置的定义，此函数在所有视图模板和布局中可用

{{ get('App\\Widget\\PerformanceMetrics').widget()|raw }}

默认主布局的应用程序模板将如下所示

{% do assetManager.register(['App\\Asset\\AppAsset', 'App\\Asset\\CdnFontAwesomeAsset']) %}
{% do this.addCssFiles(assetManager.getCssFiles()) %}
{% do this.addCssStrings(assetManager.getCssStrings()) %}
{% do this.addJsFiles(assetManager.getJsFiles()) %}
{% do this.addJsStrings(assetManager.getJsStrings()) %}
{% do this.addJsVars(assetManager.getJsVars()) %}
{{ this.beginPage()|raw }}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>{{ this.getTitle() }}</title>
        {{ this.head()|raw }}
    </head>
    <body>
    {{ this.beginBody()|raw }}
        <section class="hero is-fullheight is-light">
            <div class="hero-head has-background-black">
                {{ get('Yiisoft\\Yii\\Bulma\\NavBar').widget()
                    .brandLabel(applicationParameters.getName())
                    .brandImage('/images/yii-logo.jpg')
                    .options({'class': 'is-black', 'data-sticky': '', 'data-sticky-shadow': ''})
                    .itemsOptions({'class': 'navbar-end'})
                    .begin()|raw
                }}
                {{ get('Yiisoft\\Yii\\Bulma\\Nav').widget()
                    .currentPath(urlMatcher.getCurrentUri() != null ? urlMatcher.getCurrentUri().getPath() : '')
                    .items([])|raw
                }}
                {{ get('Yiisoft\\Yii\\Bulma\\NavBar').end()|raw }}
            </div>
            <div class="hero-body is-light">
                <div class="container has-text-centered">
                    {{ content|raw }}
                </div>
            </div>
            <div class="hero-footer has-background-black">
                <div class="columns is-mobile">
                    <div class="column has-text-left has-text-light">
                        <i class="fas fa-copyright fa-inverse is-hidden-mobile"></i>
                        <a class="is-hidden-mobile" href="https://yiiframework.cn/" target="_blank" rel="noopener">
                            {{ 'now'|date('Y') }} {{ applicationParameters.getName() }}
                        </a>
                        <a class="is-hidden-desktop is-size-6" href="https://yiiframework.cn/" target="_blank" rel="noopener">
                            {{ applicationParameters.getName() }}
                        </a>
                    </div>
                    <div class="column has-text-centered has-text-light is-hidden-mobile"></div>
                    <div class="column has-text-right has-text-light">
                        <span class="icon">
                            <a href="https://github.com/yiisoft" target="_blank" rel="noopener">
                                <i class="fab fa-github fa-inverse" aria-hidden="true"></i>
                            </a>
                        </span>
                        <span class="icon">
                            <a href="https://join.slack.com/t/yii/shared_invite/enQtMzQ4MDExMDcyNTk2LTc0NDQ2ZTZhNjkzZDgwYjE4YjZlNGQxZjFmZDBjZTU3NjViMDE4ZTMxNDRkZjVlNmM1ZTA1ODVmZGUwY2U3NDA" target="_blank" rel="noopener">
                                <i class="fab fa-slack fa-inverse " aria-hidden="true"></i>
                            </a>
                        </span>
                        <span class="icon">
                            <a href="https://#/groups/yiitalk" target="_blank" rel="noopener">
                                <i class="fab fa-facebook-f fa-inverse" aria-hidden="true"></i>
                            </a>
                        </span>
                        <span class="icon">
                            <a href="https://twitter.com/yiiframework" target="_blank" rel="noopener">
                                <i class="fab fa-twitter fa-inverse" aria-hidden="true"></i>
                            </a>
                        </span>
                        <span class="icon">
                            <a href="https://t.me/yii3ru" target="_blank" rel="noopener">
                                <i class="fab fa-telegram-plane fa-inverse"></i>
                            </a>
                        </span>
                    </div>
                </div>
            </div>
        </section>
    {{ this.endBody()|raw }}
    </body>
</html>
{{ this.endPage(true)|raw }}

主页（site/index）的视图模板将如下

{% do this.setTitle(applicationParameters.getName()) %}

<h1 class="title">Hello!</h1>

<p class="subtitle">Let's start something great with <strong>Yii3</strong>!</p>

<p class="subtitle is-italic">
    <a href="https://github.com/yiisoft/docs/tree/master/guide/en" target="_blank" rel="noopener">
        Don't forget to check the guide.
    </a>
</p>

文档

内部

如果您需要帮助或有问题，Yii 论坛是一个很好的地方。您还可以查看其他 Yii 社区资源。

许可证

Yii 视图 Twig 渲染器是自由软件。它根据 BSD 许可证的条款发布。有关更多信息，请参阅 LICENSE。

由 Yii 软件维护。

yiisoft / view-twig

维护者

详细信息

README

Yii 视图 Twig 渲染器

要求

安装

通用用法

模板

文档

许可证

支持项目

关注更新