首先，所有这些页面都选中了“在菜单中显示”项，并且在我的菜单配置中，选择了“允许 3 级子导航”。如果我太简短了，我很抱歉，但我第一次尝试发布这个问题时就丢失了这个问题。浏览器进入永久加载状态。
wagtailmenus插件前几页有教程。我正在遵循该教程，该教程中途被切断，而是变成了标签参考手册。因此，这些文档很糟糕，而且这是一些基于糟糕写作的占卜研究。
但是，根据教程，我的配置中有：
` INSTALLED_APPS = [
'home',
'scripts',
'settings',
'triggers',
'tasks',
'schedules',
.....
'wagtailmenus',
'wagtail_modeladmin', # if Wagtail >=5.1; Don't repeat if it's there already
]
.....
TEMPLATES = [
{
....
"context_processors": [
....
'wagtailmenus.context_processors.wagtailmenus',
],
},
},
]`
I have this menu structure:
-my dashboards (There are no sub-menus here.)
-settings
-Triggers
-Scripts
-Tasks
-Schedules
这实际上只是在添加其他项目之前为了显示此内容而创建的项目。我只想显示子菜单，但他们不会这样做。
我的模板是根据第一组参考标签和那里的模板设置的。我不得不猜测他们在这里打算将什么作为教程项目，什么不是，但这似乎是正确的：
base.html：
{% include 'custom_menu.html' %}
自定义菜单.html：
{% load static wagtailcore_tags wagtailuserbar %}
{% load webpack_loader %}
{% load menu_tags %}
<nav>
<div>
<header class='nav-header'>
<span>Data Autopilot Navigation</span>
</header>
</div>
<div>
<div>
{% main_menu max_levels=3 template="custom_menu/main_menu.html" sub_menu_templates="custom_menu/sub_menu.html, custom_menu/sub_level_2.html" %}
</div>
</div>
</nav>
main_menu.html：
{% load static wagtailcore_tags wagtailuserbar %}
{% load webpack_loader %}
{% load menu_tags %}
{% for item in menu_items %}
<a href="{{ item.href }}" >
<br><div>{{ item.text }}</div>
</a>
{% if item.has_children_in_menu %}
<div>{% sub_menu item %}</div>
{% endif %}
{% endfor %}
sub_menu.html：
{% load static wagtailcore_tags wagtailuserbar %}
{% load webpack_loader %}
{% load menu_tags %}
<div>
{% for item in menu_items %}
<a href="{{ item.href }}">
<tab>{{ item.text }}
</a>
{% if item.has_children_in_menu %}
<div>{% sub_menu item %}</div>
{% endif %}
{% endfor %}
</div>
sub_menu_2.html：
{% load static wagtailcore_tags wagtailuserbar %}
{% load webpack_loader %}
{% load menu_tags %}
<div>
{% for item in menu_items %}
<a href="{{ item.href }}">
{{ item.text }}
</a>
{% endfor %}
</div>
从调试来看，很明显这会正确地将模板传递到 main_menu.html 中。当遇到标签时：
<div>{% sub_menu item %}</div>它在这里停止，而不是加载 sub_menu.html 模板，而是完成 main_menu.html 并退出。它甚至不会将 sub_menu.html 模板开头的
{% main_menu max_levels=3 template="custom_menu/main_menu.html" sub_menu_templates="custom_menu/sub_menu.html, custom_menu/sub_level_2.html" %}它应该工作的方式似乎是将 menu_items->item 变量传递给 sub_menu 模板，当再次调用该部分时，它会成为 menu_items 变量。因此，这是显示子菜单的递归调用。这是在文档中……在以下部分中：
** main_menu 标签 main_menu 标签允许您在 Wagtail 项目中显示为当前站点定义的 MainMenu...它还做了一些明智的事情，例如从不为主页链接添加“祖先”类，或为其输出子级。
使用示例
{% load menu_tags %}
{% main_menu max_levels=3 template="menus/custom_main_menu.html" sub_menu_template="menus/custom_sub_menu.html" %}
默认情况下，您必须在菜单模板中调用
{% sub_menu %}item.has_children_in_menu例如：
模板/菜单/main_menu.html**
{% load menu_tags %}
<ul>
{% for item in menu_items %}
<li class="{{ item.active_class }}">
<a href="{{ item.href }}">{{ item.text }}</a>
{% if item.has_children_in_menu %}
{% sub_menu item %}
{% endif %}
</li>
{% endfor %}
</ul>
但是，这并没有按预期工作。据我所知，它很简单，并且没有偏离“教程”，但它不起作用。我正在使用 Django 5.0 和 wagtail 6.2.1 和 wagtailmenus 4.0.1。
这是我得到的输出：
我尝试了一百种不同的排列。我还发现了 sub_menu 的两个类似问题，并尝试了修复但无济于事。这似乎是我的设置所特有的，尽管我看不出我的设置与教程有任何不同。帮助！请！ :-)
我永远无法在这些版本的产品中使用它。我通过使用包含和手动菜单来解决这个问题。最终，我完全抛弃了 Wagtail 和 django 模板。不是因为它们不起作用。这花费了太多时间，而且似乎无法解决。更大的问题似乎是 CSS 样式对于这种级别的工作来说太麻烦了。两周后，我在前端切换到react/javascript，并使用django-restframework将django变成了无头RestAPI。 Django 不是问题，但我似乎无法在使用我正在使用的组合让主题和菜单按照我想要的方式运行方面取得任何进展。迁移到 Google @mui 组件使整个事情变得可行，仅仅是因为我可以将 CSS 和代码完全转储到我想要的内容。尽管我本可以花 6 个月的时间来学习 CSS 并解决问题，但这似乎并没有有效地利用时间。使用 Javascript，我仍然可以通过配置文件轻松编辑我的页面，而不必担心它们如何显示和破坏周围的所有内容。
我永远无法在这些版本的产品中使用它。我通过使用包含和手动菜单来解决这个问题。最终，我完全抛弃了 Wagtail 和 django 模板。不是因为它们不起作用。这花费了太多时间，而且似乎无法解决。更大的问题似乎是 CSS 样式对于这种级别的工作来说太麻烦了。两周后，我在前端切换到react/javascript，并使用django-restframework将django变成了无头RestAPI。 Django 不是问题，但我似乎无法在使用我正在使用的组合让主题和菜单按照我想要的方式运行方面取得任何进展。迁移到 Google @mui 组件使整个事情变得可行，仅仅是因为我可以将 CSS 和代码完全转储到我想要的内容。尽管我本可以花 6 个月的时间来学习 CSS 并解决问题，但这似乎并没有有效地利用时间。使用 Javascript，我仍然可以通过配置文件轻松编辑我的页面，而不必担心它们如何显示和破坏周围的所有内容。
