前后端分离面包屑问题

Question

前后端分离（前端非单页），如何处理面包屑问题（最多有五级）。希望能自动生成面包屑。 只用到jq

---

说个场景

1. 首页-》子菜单-》列表项-》单条详情-》详情修改

2. 中间获取单条详情，以及详情修改需要带参请求（url?a=xx&b=xx，本地获取a,b的值然后通过取值向后台请求数据）。并不是只需要获取子模块那么简单。

3. 要求生成详情修改页的面包屑

Answer 1

你获取导航的肯定是嵌套着的。然后开始在所有导航里找你的当前页面，找到了当前页面之后，更据上级导航，渲染面包屑导航

Answer 2

涉及到数据处理。你的问题描述太简单，先好好想想怎么提问吧。
我就说说一般做法：

导航的数据格式一般是一个数组或json形式的对象，内层如果有子菜单，就放在最后一个元素(如果是数组的话)或特定属性，如(children)属性下。形式大改像这样:

var nav = [
    {
        name: 'bala1'
        children: [
            {
                name: 'bala2'
                children: [
                    {
                        name: 'bala3'
                    }
                ]
            }
        ]
    },
    {}...
 ]

能看出来上面有两层子菜单吧？你要做的就是，当前页如果是'bala3'，也就是说你展开到了第三级菜单，你需要遍历这个数据(这里可以用for循环+for...in循环)，递归直到拿到bala3，将所有父级和最终页面的'name'属性的值储存到一个数据中，如下：

['bala1', 'bala2', 'bala3']

用上面的数据写出一个面包屑即可。

至于上面涉及的知识点如'递归'，以及简单的for和for...in循环，都是js数据处理基础，跟jq关系不大。我当你都理解这些概念。如果不明白可以再提问。