查询树状菜单,返回新的树状菜单
2022-11-16 本文已影响0人
写写而已
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script>
let menus = [
{
name: '河南',
children: [
{
name: '郑州',
children: [
{
name: '金水区'
},
{
name: '中原区'
}
]
},
{
name: '信阳',
children: [
{
name: '淮滨县'
}
]
}
]
},
{
name: '湖北',
children: [
{
name: '武汉市',
children: [
{
name: '武汉火车站'
}
]
},
{
name: '黄石市',
children: [
{
name: '黄冈'
}
]
}
]
}
]
let mmm = JSON.parse(JSON.stringify(menus))
let key = '中原区'
const findTree = ({ tree, field, keyword }) => {
if (!(tree && tree.length)) {
return []
}
let na = []
na = tree.map(item => {
if (item?.[field]?.toString()?.includes(keyword)) {
return item
}
if (item.children && item.children.length) {
const nc = findTree({
tree: item.children,
field,
keyword
})
if (nc && nc.length) {
return {
...item,
children: nc
}
}
return null
}
return null
})
na = na.filter(item => item != null)
return na
}
let newm = findTree({
keyword: key,
tree: menus,
field: 'name'
})
console.log(newm)
</script>
</body>
</html>