面包屑导航¶
- class Cake\View\Helper\BreadcrumbsHelper(View $view, array $config = [])¶
BreadcrumbsHelper 提供了一种简单的方法来处理应用程序中面包屑导航路径的创建和渲染。
创建面包屑导航路径¶
您可以使用 add() 方法将一个面包屑项添加到列表中。它接受三个参数
title 将显示为面包屑项标题的字符串
url 将传递给 Url 的字符串或参数数组
options 用于
item和itemWithoutLink模板的属性数组。有关更多信息，请参阅 为项目定义属性 部分。
除了添加到路径末尾之外，您还可以执行各种操作
// Add at the end of the trail
$this->Breadcrumbs->add(
'Products',
['controller' => 'products', 'action' => 'index']
);
// Add multiple crumbs at the end of the trail
$this->Breadcrumbs->add([
['title' => 'Products', 'url' => ['controller' => 'products', 'action' => 'index']],
['title' => 'Product name', 'url' => ['controller' => 'products', 'action' => 'view', 1234]],
]);
// Prepended crumbs will be put at the top of the list
$this->Breadcrumbs->prepend(
'Products',
['controller' => 'products', 'action' => 'index']
);
// Prepend multiple crumbs at the top of the trail, in the order given
$this->Breadcrumbs->prepend([
['title' => 'Products', 'url' => ['controller' => 'products', 'action' => 'index']],
['title' => 'Product name', 'url' => ['controller' => 'products', 'action' => 'view', 1234]],
]);
// Insert in a specific slot. If the slot is out of
// bounds, an exception will be raised.
$this->Breadcrumbs->insertAt(
2,
'Products',
['controller' => 'products', 'action' => 'index']
);
// Insert before another crumb, based on the title.
// If the named crumb title cannot be found,
// an exception will be raised.
$this->Breadcrumbs->insertBefore(
'A product name', // the title of the crumb to insert before
'Products',
['controller' => 'products', 'action' => 'index']
);
// Insert after another crumb, based on the title.
// If the named crumb title cannot be found,
// an exception will be raised.
$this->Breadcrumbs->insertAfter(
'A product name', // the title of the crumb to insert after
'Products',
['controller' => 'products', 'action' => 'index']
);
使用这些方法，您可以使用 CakePHP 的两步渲染过程。由于模板和布局是从内到外渲染的（这意味着包含的元素首先渲染），因此这允许您精确定义要添加面包屑的位置。
渲染面包屑导航路径¶
在将面包屑项添加到路径后，您可以使用 render() 方法轻松地渲染它。此方法接受两个数组参数
$attributes: 将应用于wrapper模板的属性数组。这使您能够向 HTML 标签添加属性。它接受特殊的templateVars键，以便在模板中插入自定义模板变量。$separator: 用于separator模板的属性数组。可能的属性是separator将显示为分隔符的字符串innerAttrs如果您的分隔符分为两个元素，则提供属性templateVars允许在模板中插入自定义模板变量
所有其他属性都将转换为 HTML 属性，并将替换模板中的
attrs键。如果您使用此选项的默认值（空），则不会渲染分隔符。
以下是如何渲染路径的示例
echo $this->Breadcrumbs->render(
['class' => 'breadcrumbs-trail'],
['separator' => '<i class="fa fa-angle-right"></i>']
);
自定义输出¶
BreadcrumbsHelper 在内部使用 StringTemplateTrait，它使您能够轻松地自定义各种 HTML 字符串的输出。它包含四个模板，具有以下默认声明
[
'wrapper' => '<ul{{attrs}}>{{content}}</ul>',
'item' => '<li{{attrs}}><a href="{{url}}"{{innerAttrs}}>{{title}}</a></li>{{separator}}',
'itemWithoutLink' => '<li{{attrs}}><span{{innerAttrs}}>{{title}}</span></li>{{separator}}',
'separator' => '<li{{attrs}}><span{{innerAttrs}}>{{separator}}</span></li>'
]
您可以使用 StringTemplateTrait 中的 setTemplates() 方法轻松地自定义它们
$this->Breadcrumbs->setTemplates([
'wrapper' => '<nav class="breadcrumbs"><ul{{attrs}}>{{content}}</ul></nav>',
]);
由于您的模板将被渲染，因此 templateVars 选项允许您在各种模板中添加自己的模板变量
$this->Breadcrumbs->setTemplates([
'item' => '<li{{attrs}}>{{icon}}<a href="{{url}}"{{innerAttrs}}>{{title}}</a></li>{{separator}}'
]);
要定义 {{icon}} 参数，只需在将面包屑项添加到路径时指定它
$this->Breadcrumbs->add(
'Products',
['controller' => 'products', 'action' => 'index'],
[
'templateVars' => [
'icon' => '<i class="fa fa-money"></i>',
],
]
);
为项目定义属性¶
如果您想要将特定的 HTML 属性应用于项目及其子项目，您可以利用 innerAttrs 键，它是 $options 参数提供的。除了 innerAttrs 和 templateVars 之外，所有内容都将作为 HTML 属性渲染
$this->Breadcrumbs->add(
'Products',
['controller' => 'products', 'action' => 'index'],
[
'class' => 'products-crumb',
'data-foo' => 'bar',
'innerAttrs' => [
'class' => 'inner-products-crumb',
'id' => 'the-products-crumb',
],
]
);
// Based on the default template, this will render the following HTML:
<li class="products-crumb" data-foo="bar">
<a href="/products/index" class="inner-products-crumb" id="the-products-crumb">Products</a>
</li>
清除面包屑导航¶
您可以使用 reset() 方法清除面包屑导航。当您想要转换面包屑导航并覆盖列表时，这可能很有用
$crumbs = $this->Breadcrumbs->getCrumbs();
$crumbs = collection($crumbs)->map(function ($crumb) {
$crumb['options']['class'] = 'breadcrumb-item';
return $crumb;
})->toArray();
$this->Breadcrumbs->reset()->add($crumbs);