我正在研究Magento 2.1.1。当我从产品列表页面打开产品页面时，我无法在面包屑上看到类别名称。它只显示主页网址，后跟产品名称。我很少能看到带有类别名称的完整面包屑。
breadcrumbs - category name is missing .
有人可以给我一些解决这个问题的想法吗？
答案 0 :(得分：2)
此问题已在Magento 2 GitHub存储库中报告： https://github.com/magento/magento2/issues/7967
评论中有一个要点，其中有一个解决方法： https://gist.github.com/mbahar/82703c4b95d924d9bc8e6990202fdeba
答案 1 :(得分：1)
我找到了经过Magento团队批准的解决方案。因为如果您使用带有块重写或插件的方法，并且您具有使用Breadcrumbs块或Magento \ Catalog \ Controller \ Product \ View.php的某些扩展，则会遇到问题。 因此，您只需要自定义app / code / Magento / Catalog / view / frontend / web / js / product / breadcrumbs.js。 因此，这是完整的代码：
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
define([
'jquery',
'Magento_Theme/js/model/breadcrumb-list'
], function ($, breadcrumbList) {
'use strict';
return function (widget) {
$.widget('mage.breadcrumbs', widget, {
options: {
categoryUrlSuffix: '',
useCategoryPathInUrl: false,
product: '',
menuContainer: '[data-action="navigation"] > ul'
},
/** @inheritdoc */
_render: function () {
this._appendCatalogCrumbs();
this._super();
},
/**
* Append category and product crumbs.
*
* @private
*/
_appendCatalogCrumbs: function () {
var categoryCrumbs = this._resolveCategoryCrumbs();
categoryCrumbs.forEach(function (crumbInfo) {
breadcrumbList.push(crumbInfo);
});
if (this.options.product) {
breadcrumbList.push(this._getProductCrumb());
}
},
/**
* Resolve categories crumbs.
*
* @return Array
* @private
*/
_resolveCategoryCrumbs: function () {
var menuItem = this._resolveCategoryMenuItem(),
categoryCrumbs = [];
if (menuItem !== null && menuItem.length) {
categoryCrumbs.unshift(this._getCategoryCrumb(menuItem));
while ((menuItem = this._getParentMenuItem(menuItem)) !== null) {
categoryCrumbs.unshift(this._getCategoryCrumb(menuItem));
}
}
return categoryCrumbs;
},
/**
* Returns crumb data.
*
* @param {Object} menuItem
* @return {Object}
* @private
*/
_getCategoryCrumb: function (menuItem) {
return {
'name': 'category',
'label': menuItem.text(),
'link': menuItem.attr('href'),
'title': ''
};
},
/**
* Returns product crumb.
*
* @return {Object}
* @private
*/
_getProductCrumb: function () {
return {
'name': 'product',
'label': this.options.product,
'link': '',
'title': ''
};
},
/**
* Find parent menu item for current.
*
* @param {Object} menuItem
* @return {Object|null}
* @private
*/
_getParentMenuItem: function (menuItem) {
var classes,
classNav,
parentClass,
parentMenuItem = null;
if (!menuItem) {
return null;
}
classes = menuItem.parent().attr('class');
classNav = classes.match(/(nav\-)[0-9]+(\-[0-9]+)+/gi);
if (classNav) {
classNav = classNav[0];
parentClass = classNav.substr(0, classNav.lastIndexOf('-'));
if (parentClass.lastIndexOf('-') !== -1) {
parentMenuItem = $(this.options.menuContainer).find('.' + parentClass + ' > a');
parentMenuItem = parentMenuItem.length ? parentMenuItem : null;
}
}
return parentMenuItem;
},
/**
* Returns category menu item.
*
* Tries to resolve category from url or from referrer as fallback and
* find menu item from navigation menu by category url.
*
* @return {Object|null}
* @private
*/
_resolveCategoryMenuItem: function () {
var categoryUrl = this._resolveCategoryUrl(),
menu = $(this.options.menuContainer),
categoryMenuItem = null;
if (categoryUrl && menu.length) {
categoryMenuItem = menu.find('a[href="' + categoryUrl + '"]');
}
return categoryMenuItem;
},
/**
* Returns category url.
*
* @return {String}
* @private
*/
_resolveCategoryUrl: function () {
var categoryUrl;
if (this.options.useCategoryPathInUrl) {
// In case category path is used in product url - resolve category url from current url.
categoryUrl = window.location.href.split('?')[0];
categoryUrl = categoryUrl.substring(0, categoryUrl.lastIndexOf('/')) +
this.options.categoryUrlSuffix;
} else {
// In other case - try to resolve it from referrer (without parameters).
categoryUrl = document.referrer;
if (categoryUrl.indexOf('?') > 0) {
categoryUrl = categoryUrl.substr(0, categoryUrl.indexOf('?'));
}
}
return categoryUrl;
}
});
return $.mage.breadcrumbs;
};
});
这是合并请求的链接：ENGCOM-1707
答案 2 :(得分：0)
我还没有尝试过上述解决方法，但是人们说它并不总是有效。
同时，以下各项似乎运行良好（我已经对其进行了测试）： https://github.com/magento/magento2/issues/7967#issuecomment-315310890
[供应商] / [模块] //观察者/目录/产品/ FullPathBreadcrumbs
类FullPathBreadcrumbs实现\ Magento \ Framework \ Event \ ObserverInterface {
protected $_registry;
protected $_categoryRepository;
public function __construct(
\Magento\Framework\Registry $registry,
\Magento\Catalog\Api\CategoryRepositoryInterface $categoryRepository
)
{
$this->_registry=$registry;
$this->_categoryRepository = $categoryRepository;
}
/**
* Execute observer
*
* @param \Magento\Framework\Event\Observer $observer
* @return void
*/
public function execute(
\Magento\Framework\Event\Observer $observer
)
{
$product = $observer->getEvent()->getProduct();
if ($product != null && !$this->_registry->registry('current_category')) {
$cats = $product->getAvailableInCategories();
if(sizeof($cats)===1){
$last = $cats[0];
}else{
end($cats);
$last = prev($cats);
}
if($last) {
$category = $this->_categoryRepository->get($last);
$this->_registry->register('current_category', $category, true);
}
}
}
}
答案 3 :(得分：0)
我已经找到上述问题的解决方案。请检查以下js文件。 供应商/ magento /模块目录/视图/前端/web/js/product/breadcrumbs.js Breadcrumbs.js文件通过使用菜单进行了一些分类。如果要自定义菜单，则面包屑-产品详细信息页面中将缺少类别名称。 菜单必须具有以下类别： 1）导航栏部分必须具有“ data-action =“ navigation”。 2）菜单li元素必须具有“ category-item”类。 3）父li元素必须具有“ nav-1”，“ nav-2”，..类，子子li（“ nav-1”）元素必须具有“ nav-1-1”，“ nav-1” -2”，依此类推。
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
define([
'jquery',
'Magento_Theme/js/model/breadcrumb-list'
], function ($, breadcrumbList) {
'use strict';
return function (widget) {
// calling menu class and data-action "categoryItemSelector","menuContainer"**
$.widget('mage.breadcrumbs', widget, {
options: {
categoryUrlSuffix: '',
useCategoryPathInUrl: false,
product: '',
categoryItemSelector: '.category-item',
menuContainer: '[data-action="navigation"] > ul'**
},
/** @inheritdoc */
_render: function () {
this._appendCatalogCrumbs();
this._super();
},
/**
* Append category and product crumbs.
*
* @private
*/
_appendCatalogCrumbs: function () {
var categoryCrumbs = this._resolveCategoryCrumbs();
categoryCrumbs.forEach(function (crumbInfo) {
breadcrumbList.push(crumbInfo);
});
if (this.options.product) {
breadcrumbList.push(this._getProductCrumb());
}
},
/**
* Resolve categories crumbs.
*
* @return Array
* @private
*/
_resolveCategoryCrumbs: function () {
var menuItem = this._resolveCategoryMenuItem(),
categoryCrumbs = [];
if (menuItem !== null && menuItem.length) {
categoryCrumbs.unshift(this._getCategoryCrumb(menuItem));
while ((menuItem = this._getParentMenuItem(menuItem)) !== null) {
categoryCrumbs.unshift(this._getCategoryCrumb(menuItem));
}
}
return categoryCrumbs;
},
/**
* Returns crumb data.
*
* @param {Object} menuItem
* @return {Object}
* @private
*/
_getCategoryCrumb: function (menuItem) {
return {
'name': 'category',
'label': menuItem.text(),
'link': menuItem.attr('href'),
'title': ''
};
},
/**
* Returns product crumb.
*
* @return {Object}
* @private
*/
_getProductCrumb: function () {
return {
'name': 'product',
'label': this.options.product,
'link': '',
'title': ''
};
},
/**
* Find parent menu item for current.
*
* @param {Object} menuItem
* @return {Object|null}
* @private
*/
_getParentMenuItem: function (menuItem) {
var classes,
classNav,
parentClass,
parentMenuItem = null;
if (!menuItem) {
return null;
}
classes = menuItem.parent().attr('class');
// calling menu nav class**********
**classNav = classes.match(/(nav\-)[0-9]+(\-[0-9]+)+/gi);**
if (classNav) {
classNav = classNav[0];
parentClass = classNav.substr(0, classNav.lastIndexOf('-'));
if (parentClass.lastIndexOf('-') !== -1) {
parentMenuItem = $(this.options.menuContainer).find('.' + parentClass + ' > a');
parentMenuItem = parentMenuItem.length ? parentMenuItem : null;
}
}
return parentMenuItem;
},
/**
* Returns category menu item.
*
* Tries to resolve category from url or from referrer as fallback and
* find menu item from navigation menu by category url.
*
* @return {Object|null}
* @private
*/
_resolveCategoryMenuItem: function () {
var categoryUrl = this._resolveCategoryUrl(),
menu = $(this.options.menuContainer),
categoryMenuItem = null;
if (categoryUrl && menu.length) {
categoryMenuItem = menu.find(
this.options.categoryItemSelector +
' > a[href="' + categoryUrl + '"]'
);
}
return categoryMenuItem;
},
/**
* Returns category url.
*
* @return {String}
* @private
*/
_resolveCategoryUrl: function () {
var categoryUrl;
if (this.options.useCategoryPathInUrl) {
// In case category path is used in product url - resolve category url from current url.
categoryUrl = window.location.href.split('?')[0];
categoryUrl = categoryUrl.substring(0, categoryUrl.lastIndexOf('/')) +
this.options.categoryUrlSuffix;
} else {
// In other case - try to resolve it from referrer (without parameters).
categoryUrl = document.referrer;
if (categoryUrl.indexOf('?') > 0) {
categoryUrl = categoryUrl.substr(0, categoryUrl.indexOf('?'));
}
}
return categoryUrl;
}
});
return $.mage.breadcrumbs;
};
});