README

该组件提供了一些简单的Twig过滤器和方法，通过添加特定的CSS类来帮助高亮显示Twig模板中简单HTML菜单的当前激活菜单项。

如何安装

使用Composer安装组件

composer require bw/active-menu-item-bundle

然后，为了在Twig中使用过滤器和方法，请在bundles.php中注册此组件

// config/bundles.php

return [
    // other bundles...
    BW\ActiveMenuItemBundle\BWActiveMenuItemBundle::class => ['all' => true],
};

但如果您使用Symfony Flex，这已经自动为您完成：）

如何使用

要检查菜单项路由是否激活，只需使用is_active Twig过滤器

{{ 'route_name'|is_active }}

或使用is_active_uri Twig过滤器检查菜单项的请求URI是否激活

{{ path('route_name')|is_active_uri }}

如果路由或请求URI匹配，过滤器将返回您需要在菜单项标签的class属性中使用的current active字符串。然后，您只需要在样式表中添加这些类的自定义CSS规则。

如何使用多级嵌套菜单

要检查一组可能的路由，请使用is_active() Twig函数，并将路由数组（当前项的所有子菜单项路由名称）作为第一个参数传递，将当前项路由名称作为第二个参数传递。

例如，有一个简单的HTML菜单，带有嵌套子菜单

<ul>
    <li class="{{ is_active([
        'subcategory1_route_name',
        'subcategory2_route_name',
    ], 'all_categories_route_name') }}">
        <a href="{{ path('all_categories_route_name') }}">All categories</a>
        <ul>
            <li class="{{ 'subcategory1_route_name'|is_active }}">
                <a href="{{ path('subcategory1_route_name') }}">Subcategory 1</a>
            </li>
            <li class="{{ 'subcategory2_route_name'|is_active }}">
                <a href="{{ path('subcategory2_route_name') }}">Subcategory 2</a>
            </li>
        </ul>
    </li>
</ul>

如果当前路由是subcategory1_route_name，它将具有current active类，其父项-all_categories_route_name路由-将只具有active类。

对于请求URI，也使用is_active_uri() Twig函数相同，但不需要传递路由数组，而是传递URI数组。

演示

此组件有一个带有简单多级HTML菜单示例的演示页面。创建以下文件以在dev Symfony模式下查看演示

# config/routes/dev/bw_active_menu_item.yaml

bw_active_menu_item:
    resource: "@BWActiveMenuItemBundle/Resources/config/routing.yml"
    prefix:   /bw/demo/active-menu-item

然后，使用symfony serve运行Symfony内置的Web服务器，并转到： https://:8000/bw/demo/active-menu-item/index。

内部结构

只有几个简单的Twig过滤器和函数，就这些！

简单，不是吗？：）