README

ArrayMenu 2

使用 array[] 构建来自 Bootstrap 5 的菜单/导航栏

安装

composer require wtabata/arraymenu

简单模式

将构建 标准HTML列表 结构

$array = [
    'home' => [
        'name' => 'Label for Home',
        'link' => '#',
    ],
    [ /* << see, here don't have key. no matter. just for help u */
        'name' => 'Label for Contact'
    ],
];

$menu = new \Wt\ArrayMenu\Simple($array);
echo $menu;

输出

<ol class="more_class my_class">
    <li class=""><a class="" href="#">Label for Home</a></li>
    <li class="">Label for Contact</li>
</ol>

默认列表标签

<ul> <!-- init - primary tag -->
    <li> <!-- item - secondary tag -->
        <a href="#"> - </a> <!-- link - content -->
    </li>
</ul>

两种配置标签的方式

全局

//set primary Tag 
$menu->setInit(['tag'=>'ol', 'class' =>'my_class']);

//set secondary Tag
$menu_b->setItem(['tag'=>'li', 'class' =>'my_class_for_item other']);

或每个项目

$array = [
    'config' => [ //set primary Tag 
        'tag' => 'ol',
        'class' => 'my_class'
    ],
    'home' => [
        'config' => [ //set secondary Tag
            'tag' => 'dd',
            'class' =>'my_class_for_item other'
        ],
        'name' => 'Label for Home',
        'link' => '#',
    ],
];

Bootstrap 5 模式

将构建 Bootstrap 5 导航栏 结构

$array = [
    'home' => [
        'name' => 'Label for Home',
        'link' => '#',
        'class' => 'nav-link',
    ],
    'contact' => [
        'name' => 'Label for Contact',
        'link' => '#',
        'class' => 'nav-link',
    ],
    'sitemap' => [
        'name' => 'Label for Sitemap',
        'link' => '#',
        'class' => 'nav-link active',
    ]
];

$menu = new \WtArrayMenu\Bootstrap($array, $config_bootstrap = []);
echo $menu;

Bootstrap 5 默认配置

$config_bootstrap = [
    'position' => 'default',
    'color' => 'bg-primary',
    'container' => 'container',
    'brand' => [
        'name' => 'WT.dev',
        'image' => false,
        'link' => 'https://wtabata.com'
    ],
    'off_canvas' => false
];

待办事项

文档

• 简单使用方法
• 与 Bootstrap 一起使用的方法
• 默认标签
• 自定义标签
• 基本选项
• Bootstrap 选项

基础

• 其他非标准标签

Bootstrap

• 滚动