Question

我使用cloudcribe导航来构建侧边栏和相关的痕迹导航菜单

我无法在帮助文档中找到它，因此请在此处发布

我们的路由模板中有一些路由参数 - 我不确定如何保留面包屑中的那些，导航参数保留路由参数我知道只能使用查询字符串参数

我们的路线是这样的：

{wholesaleCustomerCode} / {面积：存在} / {baseItemId：GUID} / {控制器=主页} / {行动=索引} / {ID：？GUID}

并将翻译为：

http://127.0.0.1:5100/TOM/Service/09185d87-5e3f-4217-a0b9-02f766efc714/Home/Detail

现在当我在/ Detail视图中 - 它嵌套得非常深 - 但是breadcrumb中的前一个父节点丢失了baseItemId值 - 任何建议我如何在面包屑层次结构中保留路由参数？

我尝试了以下方法，只是为了测试它是否会选择保留路由参数，但是没有工作

<Children>
                    <NavNode
                    key="d902daaa-99ec-488a-85de-c03641fb547d"
                    area="Service"
                    controller="Home"
                    action="Detail"
                    text="Service"
                    iconCssClass=""
                    componentVisibility="breadcrumbs"
                    viewRoles="Administrator"
                    preservedRouteParameters="baseItemId"
                    >
                        <Children>
                            <NavNode
                            key="3047c57d-0f8c-4875-aff9-9c1f91909e41"
                            area="Service"
                            controller="RecurringCredit"
                            action="Edit"
                            text="Recurring Credit"
                            iconCssClass=""
                            componentVisibility="breadcrumbs"
                            viewRoles="Administrator"
                            preservedRouteParameters="baseItemId"
                            >
                            </NavNode></Children></NavNode>

Answer 1

safeRouteParameters确实只适用于查询字符串参数。一种可能的解决方案是使用控制器操作中的代码为您的详细信息视图根据需要更新父痕迹的URL。相关文档：https://www.cloudscribe.com/docs/adjusting-menu-items-per-request

var crumbAdjuster = new NavigationNodeAdjuster(Request.HttpContext);
crumbAdjuster.KeyToAdjust = "d902daaa-99ec-488a-85de-c03641fb547d";
crumbAdjuster.AdjustedUrl = // set the url here as you want it to be;
crumbAdjuster.AddToContext();

将更新当前请求生命周期内给定菜单节点的url

Answer 2

以下是我解决问题的方法

请考虑从cloudscribe.Web.Navigation / Views中获得以下默认的BootstrapBreadcrumbs视图：

@using cloudscribe.Web.Navigation
@model NavigationViewModel
@if (Model.CurrentNode != null && (Model.ParentChain.Count > 1 || (Model.TailCrumbs != null && Model.TailCrumbs.Count > 0)))
{
    <ul class="breadcrumb">
    @foreach (var node in Model.ParentChain)
    {
        if (!Model.ShouldAllowView(node)) { continue; }
        if (node.EqualsNode(Model.CurrentNode))
        {
            if (Model.TailCrumbs != null)
            {
                <li><a href="@Url.Content(Model.AdjustUrl(node))">@Model.AdjustText(node)</a><span class="divider"></span></li>
            }
            else
            {
                <li class="active">@Model.AdjustText(node)</li>
            }
        }
        else
        {
            <li><a href="@Url.Content(Model.AdjustUrl(node))">@Model.AdjustText(node)</a><span class="divider"></span></li>
        }
    }
    @if (Model.TailCrumbs != null)
    {
        foreach (var n in Model.TailCrumbs)
        {
            <li class="active">@n.Text</li>
        }
    }
    </ul>
}

而不是使用Model.AdjustUrl绕过它而支持使用asp-route- * helper

@using cloudscribe.Web.Navigation
@model NavigationViewModel
@{
    var id = ViewContext.RouteData.Values["id"];
    var baseItemId = ViewContext.RouteData.Values["baseItemId"];
    var orderId = ViewContext.HttpContext.Request.Query["orderId"];
}

@if (Model.CurrentNode != null && (Model.ParentChain.Count > 1 || (Model.TailCrumbs != null && Model.TailCrumbs.Count > 0)))
{
    <ul class="breadcrumb">
    @foreach (var node in Model.ParentChain)
    {
        if (!Model.ShouldAllowView(node)) { continue; }
        if (node.EqualsNode(Model.CurrentNode))
        {
            if (Model.TailCrumbs != null)
            {
                <li><a asp-area="@node.Value.Area" asp-controller="@node.Value.Controller" asp-action="@node.Value.Action" asp-route-baseItemId="@baseItemId" asp-route-orderId="@orderId" asp-route-id="@id">
                    @Model.AdjustText(node)
                    </a>
                    <span class="divider"></span>
                </li>
            }
            else
            {
                <li class="active">@Model.AdjustText(node)</li>
            }
        }
        else
        {
            <li><a asp-area="@node.Value.Area" asp-controller="@node.Value.Controller" asp-action="@node.Value.Action" asp-route-baseItemId="@baseItemId" asp-route-orderId="@orderId" asp-route-id="@id">@Model.AdjustText(node)</a><span class="divider"></span></li>
        }
    }
    @if (Model.TailCrumbs != null)
    {
        foreach (var n in Model.TailCrumbs)
        {
            <li class="active">@n.Text</li>
        }
    }
    </ul>
}

这种实现有一些缺点，可能对每个人都不起作用 - 例如，所有以前的面包屑层次结构现在都在路由中有baseItemId - e.g。

信息中心/所有备注/备注/明细

这里，所有笔记也会添加baseItemId，虽然它不需要它 -

但它适用于我们，因为它是一个管理门户（没有SEO要求）和路由模板的映射方式

如何在cloudscribe导航中的痕迹中实现路由参数？

2 个答案: