将省市区树状数据转换为扁平结构
本文介绍如何将三级树状结构的省市区数据扁平化。原始数据采用树形结构,每个节点包含代码 (code)、名称 (value) 和选中状态 (checked)。目标是根据选中状态生成一个扁平数组,包含省份、城市和区县的代码及层级信息。
原始数据结构示例:
[
{
"code": "110000",
"value": "北京市",
"checked": "1",
"children": [
{
"code": "110100",
"value": "北京市",
"checked": "1",
"children": [
{"code": "110101", "value": "东城区", "checked": "1"},
{"code": "110102", "value": "西城区", "checked": "1"}
]
}
]
},
{
"code": "120000",
"value": "天津市",
"checked": "1",
"children": [
{
"code": "120100",
"value": "天津市",
"checked": "1",
"children": [
{"code": "120101", "value": "和平区", "checked": "0"},
{"code": "120102", "value": "河东区", "checked": "1"}
]
}
]
}
]
目标扁平化数据结构示例:
[
{
"provinceCode": "110000",
"cityCode": null,
"districtCode": null,
"level": 1
},
{
"provinceCode": "120000",
"cityCode": "120100",
"districtCode": "120102",
"level": 3
}
]
转换逻辑:
采用递归遍历树状结构,根据 checked 状态判断。如果所有子节点都被选中,则只保留父节点信息;如果部分子节点被选中,则保留所有被选中的节点信息。
JavaScript 实现代码:
function flattenData(data) {
const result = [];
function traverse(node, parent) {
if (node.checked === "1") {
const item = {
provinceCode: parent ? parent.provinceCode : node.code,
cityCode: parent ? (parent.cityCode || (parent.level === 1 ? node.code : null)) : null,
districtCode: parent ? (parent.level === 2 ? node.code : null) : null,
level: parent ? parent.level + 1 : 1
};
result.push(item);
}
if (node.children) {
node.children.forEach(child => traverse(child, item));
}
}
data.forEach(province => traverse(province));
return result;
}
// 示例用法
const data = [/* 原始数据 */];
const flattenedData = flattenData(data);
console.log(flattenedData);
这段代码通过递归函数 traverse 遍历树形结构,根据 checked 属性和父节点信息构建扁平化数据。 它使用了更简洁的逻辑,避免了多个嵌套函数,并对代码进行了优化。 level 属性直接根据父节点的 level 推断,简化了逻辑。
以上就是如何将省市区树状结构数据扁平化处理?的详细内容,更多请关注知识资源分享宝库其它相关文章!
版权声明
本站内容来源于互联网搬运,
仅限用于小范围内传播学习,请在下载后24小时内删除,
如果有侵权内容、不妥之处,请第一时间联系我们删除。敬请谅解!
E-mail:dpw1001@163.com
发表评论