JavaScript 递归遍历json串获取相关数据
递归遍历json串获取相关数据
by:授客 qq：1033553122
- 1. 测试数据
// 导航菜单
[
{
id: 1,
parentid: 0,
parentname: null,
name: "首页",
url: "/home",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",a
ordernum: 1,
level: 0,
children: [
{
id: 2,
parentid: 1,
parentname: null,
name: "首页二级菜单1",
url: "",
perms: null,
requireauth: true,
hidden: false,
type: 1,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: [
{
id: 3,
parentid: 2,
parentname: null,
name: "首页三级菜单1",
url: "",
perms: null,
requireauth: true,
hidden: false,
type: 1,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: [
{
id: 4,
parentid: 3,
parentname: null,
name: "首页四级菜单1",
url: "/home/level4menu1",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: []
}
]
},
{
id: 5,
parentid: 2,
parentname: null,
name: "首页三级菜单2",
url: "/home/level3menu2",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 2,
level: 0,
children: []
}
]
},
{
id: 6,
parentid: 1,
parentname: null,
name: "首页二级菜单2",
url: "",
perms: null,
requireauth: true,
hidden: false,
type: 1,
icon: "fa fa-home fa-lg",
ordernum: 2,
level: 0,
children: [
{
id: 7,
parentid: 6,
parentname: null,
name: "首页三级菜单3",
url: "/home/level3menu3",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: []
}
]
}
]
},
{
id: 8,
parentid: 0,
parentname: null,
name: "工作台",
url: "/workbench",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 2,
level: 0,
children: []
},
{
id: 9,
parentid: 0,
parentname: null,
name: "测试视图",
url: "/testerview",
perms: null,
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 3,
level: 0,
children: [
{
id: 10,
parentid: 9,
parentname: null,
name: "测试视图二级菜单1",
url: "",
perms: null,
requireauth: true,
hidden: false,
type: 1,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: [
{
id: 11,
parentid: 10,
parentname: null,
name: "测试视图三级菜单1",
url: "/testerview/level3menu1",
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: []
},
{
id: 12,
parentid: 10,
parentname: null,
name: "测试视图三级菜单2",
url: "/testerview/level3menu2",
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 2,
level: 0,
children: []
}
]
}
]
},
{
id: 13,
parentid: 0,
parentname: null,
name: "配置",
url: "/settings",
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 4,
level: 0,
children: []
},
{
id: 14,
parentid: 0,
parentname: null,
name: "其它",
url: "",
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 5,
level: 0,
children: [
{
id: 15,
parentid: 14,
parentname: null,
name: "其它菜单",
url: "/other",
requireauth: true,
hidden: false,
type: 0,
icon: "fa fa-home fa-lg",
ordernum: 1,
level: 0,
children: []
}
]
}
]
- 2. 需求1
获取菜单“路由”信息：
获取每级菜单的url,name,icon, id, requireauth字段信息，构成节点，以及其子菜单对应字段的信息，构成子节点，要求：
如果本级菜单url为空，则不记录该级菜单相关的信息，此时，如果其子菜单url不为空，则要记录其子菜单相关字段的信息，并向上查找离该子菜单最近，并且url不为空的菜单信息，并把该菜单信息当做其父节点，形如以下
[{path:"/home "，
name: "首页"，
meta: {icon: "fa fa-home fa-lg", index: 4, requireauth: true}，
children:[{path: "/home/level3menu3",
name: "首页三级菜单3",
meta: {icon: "fa fa-home fa-lg", index: 4, requireauth: true},
children: []},
...
]
},
...
]
如果本级菜单url不为空，则记录该级菜单自身的信息，作为父节点，此时，如果其子菜单url不为空，则要记录其子菜单相关字段的信息，构成子节点，否则不记录子菜单信息
编码
function getmenuroutes(menulist = [], parent = []) {
for (var i = 0; i < menulist.length; i++) {
var route = {}
if (menulist[i].url && /\s/.test(menulist[i].url)) {
route = {
path: menulist[i].url,
name: menulist[i].name,
children: [],
meta: {
icon: menulist[i].icon,
index: menulist[i].id,
requireauth: menulist[i].requireauth
}
}
if (menulist[i].children && menulist[i].children.length >= 1) {
getmenuroutes(menulist[i].children, route["children"])
}
} else {
if (menulist[i].children && menulist[i].children.length >= 1) {
getmenuroutes(menulist[i].children, parent)
}
}
if (json.stringify(route) != "{}") {
parent.push(route)
}
}
return parent
}
调用
var result = getmenuroutes(navmenudata, [])
console.log(result)
结果
- 3. 需求2
获取每级菜单的url,name,icon, id, requireauth字段信息，构成一级节点，要求：
如果级菜单url为空，则不记录该级菜单相关的信息
编码
function getmenuroutes (menulist = [], routes = []) {
var temp = []
for (var i = 0; i < menulist.length; i++) {
var route = {}
if (menulist[i].url && /\s/.test(menulist[i].url)) {
var route = {
path: menulist[i].url,
name: menulist[i].name,
children: [],
meta: {
icon: menulist[i].icon,
index: menulist[i].id,
requireauth: menulist[i].requireauth
}
}
routes.push(route)
}
if (menulist[i].children && menulist[i].children.length >= 1) {
temp = temp.concat(menulist[i].children)
}
}
if (temp.length >= 1) {
getdynamicroutes2(temp, routes)
}
return routes
调用
var result = getmenuroutes(navmenudata, [])
console.log(result)
结果
上一篇： HTC EXODUS 1-Binance版亮相：4600元
下一篇： 这不是舞狮吗？