README

yii2-bootstrap5-dropdown      

增强型Bootstrap 5.x下拉小部件，支持嵌套子菜单，适用于Yii2框架。

文档 & 演示

您可以在文档 & 演示以及API代码文档中查看扩展的详细使用说明。

安装

安装此扩展的首选方式是通过composer。

注意：请检查此扩展的composer.json以了解其要求和依赖项。请阅读此网页提示 / wiki，了解如何在您的应用程序的composer.json中设置minimum-stability设置。

运行以下命令之一：

$ php composer.phar require kartik-v/yii2-bootstrap5-dropdown "@dev"

或添加以下内容到您的composer.json文件的require部分：

"kartik-v/yii2-bootstrap5-dropdown": "@dev"

使用

用法

下拉菜单导航栏

use yii\bootstrap5\NavBar;
use yii\bootstrap5\Nav;
use kartik\bs4dropdown\Dropdown;
use yii\helpers\Html;

NavBar::begin(['brandLabel' => 'NavBar Test']);
echo Nav::widget([
    'items' => [
        ['label' => 'Home', 'url' => ['/site/index']],
        [
            'label' => 'Dropdown', 
            'items' => [
                ['label' => 'Section 1', 'url' => '/'],
                ['label' => 'Section 2', 'url' => '#'],
                [
                     'label' => 'Section 3', 
                     'items' => [
                         ['label' => 'Section 3.1', 'url' => '/'],
                         ['label' => 'Section 3.2', 'url' => '#'],
                         [
                             'label' => 'Section 3.3', 
                             'items' => [
                                 ['label' => 'Section 3.3.1', 'url' => '/'],
                                 ['label' => 'Section 3.3.2', 'url' => '#'],
                             ],
                         ],
                     ],
                 ],
            ],
        ],
        ['label' => 'About', 'url' => ['/site/about']],
    ],
    'dropdownClass' => Dropdown::classname(), // use the custom dropdown
    'options' => ['class' => 'navbar-nav mr-auto'],
]);
NavBar::end();

<div class="dropdown">
    <?php
        echo Html::button('Dropdown Button', [
           'id' => 'dropdownMenuButton',
           'class' => 'btn btn-secondary dropdown-toggle'
           'data-toggle' => 'dropdown',
           'aria-haspopup' => 'true',
           'aria-expanded' => 'false'
        ]);
        echo Dropdown::widget([
            'items' => [
                ['label' => 'Section 1', 'url' => '/'],
                ['label' => 'Section 2', 'url' => '#'],
                [
                     'label' => 'Section 3', 
                     'items' => [
                         ['label' => 'Section 3.1', 'url' => '/'],
                         ['label' => 'Section 3.2', 'url' => '#'],
                         [
                             'label' => 'Section 3.3', 
                             'items' => [
                                 ['label' => 'Section 3.3.1', 'url' => '/'],
                                 ['label' => 'Section 3.3.2', 'url' => '#'],
                             ],
                         ],
                     ],
                 ],
            ],
            'options' => ['aria-labelledby' => 'dropdownMenuButton']
        ]);
    ?>
</div>

单独按钮下拉

<?php 
use \yii\helpers\Html;
use kartik\bs4dropdown\Dropdown;
?>
<div class="dropdown">
    <?php
        echo Html::button('Dropdown Button', [
           'id' => 'dropdownMenuButton',
           'class' => 'btn btn-secondary dropdown-toggle'
           'data-toggle' => 'dropdown',
           'aria-haspopup' => 'true',
           'aria-expanded' => 'false'
        ]);
        echo Dropdown::widget([
            'items' => [
                ['label' => 'Section 1', 'url' => '/'],
                ['label' => 'Section 2', 'url' => '#'],
                [
                     'label' => 'Section 3', 
                     'items' => [
                         ['label' => 'Section 3.1', 'url' => '/'],
                         ['label' => 'Section 3.2', 'url' => '#'],
                         [
                             'label' => 'Section 3.3', 
                             'items' => [
                                 ['label' => 'Section 3.3.1', 'url' => '/'],
                                 ['label' => 'Section 3.3.2', 'url' => '#'],
                             ],
                         ],
                     ],
                 ],
            ],
            'options' => ['aria-labelledby' => 'dropdownMenuButton']
        ]);
    ?>
</div>

按钮下拉替代方案（使用ButtonDropdown）

use \yii\helpers\Html;
use kartik\bs4dropdown\ButtonDropdown;
echo ButtonDropdown::widget([
    'label' => 'Dropdown Button',
    'dropdown' => [
        'items' => [
            ['label' => 'Section 1', 'url' => '/'],
            ['label' => 'Section 2', 'url' => '#'],
            [
                 'label' => 'Section 3', 
                 'items' => [
                     ['label' => 'Section 3.1', 'url' => '/'],
                     ['label' => 'Section 3.2', 'url' => '#'],
                     [
                         'label' => 'Section 3.3', 
                         'items' => [
                             ['label' => 'Section 3.3.1', 'url' => '/'],
                             ['label' => 'Section 3.3.2', 'url' => '#'],
                         ],
                     ],
                 ],
             ],
        ],
    ],
    'buttonOptions' => ['class'=>'btn-secondary']
]);

许可协议

yii2-bootstrap5-dropdown遵循BSD-3-Clause许可协议。有关详细信息，请参阅附带的LICENSE.md文件。