kartik-v/yii2-bootstrap4-dropdown

增强型Bootstrap 4.x下拉小部件,适用于Yii2,支持嵌套子菜单

安装次数: 1,671,796

依赖项: 18

建议者: 4

安全: 0

星标: 9

关注者: 3

分支: 2

开放性问题: 0

类型:yii2-extension

v1.0.4 2022-01-10 04:03 UTC

This package is auto-updated.

Last update: 2024-09-10 09:37:07 UTC


README

Krajee Logo
yii2-bootstrap4-dropdown Donate       kartikv

Stable Version Unstable Version License Total Downloads Monthly Downloads Daily Downloads

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

文档 & 演示

您可以在文档 & 演示中查看扩展的详细信息和API代码文档

安装

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

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

运行以下命令之一:

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

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

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

使用

使用

下拉菜单导航栏

use yii\bootstrap4\NavBar;
use yii\bootstrap4\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-bootstrap4-dropdown遵循BSD-3-Clause许可证发布。有关详细信息,请参阅打包的LICENSE.md文件。