Javascript 使用JSON构建层次结构树
我有一个带有Javascript 使用JSON构建层次结构树,javascript,json,typescript,tree-structure,Javascript,Json,Typescript,Tree Structure,我有一个带有C_PARENT字段的对象列表。此父字段引用列表中的另一个对象。我想在此列表中基于此字段创建树层次结构 这是我的数据 [{ "C_ID" : 1.0, "C_TITLE" : "Sparklers", "C_PARENT" : 0.0, "C_STATUS" : "Active" }, { "C_ID" : 2.0, "C_TITLE" : "Twinklers", "C_PARENT" : 0, "C_STATUS"
C_PARENT
字段的对象列表。此父字段引用列表中的另一个对象。我想在此列表中基于此字段创建树层次结构
这是我的数据
[{
"C_ID" : 1.0,
"C_TITLE" : "Sparklers",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 2.0,
"C_TITLE" : "Twinklers",
"C_PARENT" : 0,
"C_STATUS" : "Active"
},
{
"C_ID" : 3.0,
"C_TITLE" : "Candles",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 4.0,
"C_TITLE" : "Chakkars",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 5.0,
"C_TITLE" : "Colour Chakkars",
"C_PARENT" : 4.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 6.0,
"C_TITLE" : "Fancy Chakkars",
"C_PARENT" : 4.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 7.0,
"C_TITLE" : "Fountains",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 8.0,
"C_TITLE" : "Whistling Fountains",
"C_PARENT" : 7.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 9.0,
"C_TITLE" : "Fancy Fountains",
"C_PARENT" : 7.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 10.0,
"C_TITLE" : "Fancy Colour Fountains",
"C_PARENT" : 7.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 11.0,
"C_TITLE" : "Rockets",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
}]
我需要转换成树结构
[
{
'C_ID': 1,
'C_TITLE': 'Sparklers',
'C_PARENT': 0,
'C_STATUS':'Active'
},
{
"C_ID" : 2.0,
"C_TITLE" : "Twinklers",
"C_PARENT" : 0,
"C_STATUS" : "Active"
},
{
"C_ID" : 3.0,
"C_TITLE" : "Candles",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
}
{
'"C_ID" : 4.0,
"C_TITLE" : "Chakkars",
"C_PARENT" : 0.0,
"C_STATUS" : "Active"
children: [
{
"C_ID" : 5.0,
"C_TITLE" : "Colour Chakkars",
"C_PARENT" : 4.0,
"C_STATUS" : "Active"
},
{
"C_ID" : 6.0,
"C_TITLE" : "Fancy Chakkars",
"C_PARENT" : 4.0,
"C_STATUS" : "Active"
}
]
]
我不知道
请给我提个建议
谢谢我通常使用属性信息创建一个新字符串
String.prototype.replaceAll = function (search, replacement) {
return this.replace(new RegExp(search, 'g'), replacement);
};
var data = JSON.parse('[{"C_ID" : 1.0,"C_TITLE" : "Sparklers","C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 2.0, "C_TITLE" : "Twinklers", "C_PARENT" : 0, "C_STATUS" : "Active"},{ "C_ID" : 3.0, "C_TITLE" : "Candles", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 4.0, "C_TITLE" : "Chakkars", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 5.0, "C_TITLE" : "Colour Chakkars", "C_PARENT" : 4.0, "C_STATUS" : "Active"},{ "C_ID" : 6.0, "C_TITLE" : "Fancy Chakkars", "C_PARENT" : 4.0, "C_STATUS" : "Active"},{ "C_ID" : 7.0, "C_TITLE" : "Fountains", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 8.0, "C_TITLE" : "Whistling Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 9.0, "C_TITLE" : "Fancy Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 10.0, "C_TITLE" : "Fancy Colour Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 11.0, "C_TITLE" : "Rockets", "C_PARENT" : 0.0, "C_STATUS" : "Active"}]');
var result = '[';
for (i = 0; i < data.length; i++) {
if (data[i].C_PARENT == 0 || data[i].C_PARENT == "0") {
if (i != 0)
result += ']},';
result += '{"C_ID" : ' + data[i].C_ID + ', "C_TITLE" : "' + data[i].C_TITLE + '", "C_PARENT" : ' + data[i].C_PARENT + ', "C_STATUS" : "' + data[i].C_STATUS + '", "children" : [';
} else {
result += '{"C_ID" : ' + data[i].C_ID + ', "C_TITLE" : "' + data[i].C_TITLE + '", "C_PARENT" : ' + data[i].C_PARENT + ', "C_STATUS" : "' + data[i].C_STATUS + '"},';
}
}
result += ']}]';
result = result.replaceAll("},]", "}]");
var a = JSON.parse(result);
document.getElementById('result').innerHTML = result + "<br/><br/><br/>" + a;
String.prototype.replaceAll=函数(搜索、替换){
返回此.replace(新的RegExp(搜索'g'),replacement);
};
var data=JSON.parse(“[{”C_ID“:1.0,“C_TITLE:“sparkers”,“C_PARENT”:0.0,“C_STATUS:“Active”},{”C_ID“:2.0,“C_TITLE:“Twinklers”,“C_PARENT”:0,“C_STATUS:“Active”},{”C_ID“:3.0,“C_TITLE:“can烛光”,“C_PARENT”:0.0,“C_STATUS:“Active”},{”C"C_ID:4.0,“C_TITLE:“Chakkars”,“C_PARENT”:0.0,“C_状态”:“活动”},{“C_ID”:5.0,“C_标题”:“彩色Chakkars”,“C_父项”:4.0,“C_状态”:“活动”},{“C_ID”:6.0,“C_标题”:“花式Chakkars”,“C_父项”:4.0,“C_状态”:“活动”},{“C_ID”:7.0,“C_标题”:“喷泉”,“C_父项”:0.0,“C_状态”:“活动”},{“C_ID”:8.0,“C_标题”:“吹口哨的喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:9.0,“C_标题”:“花式喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:10.0,“C_标题”:“花式色彩喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:11.0,“C_标题”:“火箭”,“C_家长”“:0.0,“C_状态”:“活动”}]”;
var结果='[';
对于(i=0;i
+a;
我通常使用属性信息创建新字符串
String.prototype.replaceAll = function (search, replacement) {
return this.replace(new RegExp(search, 'g'), replacement);
};
var data = JSON.parse('[{"C_ID" : 1.0,"C_TITLE" : "Sparklers","C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 2.0, "C_TITLE" : "Twinklers", "C_PARENT" : 0, "C_STATUS" : "Active"},{ "C_ID" : 3.0, "C_TITLE" : "Candles", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 4.0, "C_TITLE" : "Chakkars", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 5.0, "C_TITLE" : "Colour Chakkars", "C_PARENT" : 4.0, "C_STATUS" : "Active"},{ "C_ID" : 6.0, "C_TITLE" : "Fancy Chakkars", "C_PARENT" : 4.0, "C_STATUS" : "Active"},{ "C_ID" : 7.0, "C_TITLE" : "Fountains", "C_PARENT" : 0.0, "C_STATUS" : "Active"},{ "C_ID" : 8.0, "C_TITLE" : "Whistling Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 9.0, "C_TITLE" : "Fancy Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 10.0, "C_TITLE" : "Fancy Colour Fountains", "C_PARENT" : 7.0, "C_STATUS" : "Active"},{ "C_ID" : 11.0, "C_TITLE" : "Rockets", "C_PARENT" : 0.0, "C_STATUS" : "Active"}]');
var result = '[';
for (i = 0; i < data.length; i++) {
if (data[i].C_PARENT == 0 || data[i].C_PARENT == "0") {
if (i != 0)
result += ']},';
result += '{"C_ID" : ' + data[i].C_ID + ', "C_TITLE" : "' + data[i].C_TITLE + '", "C_PARENT" : ' + data[i].C_PARENT + ', "C_STATUS" : "' + data[i].C_STATUS + '", "children" : [';
} else {
result += '{"C_ID" : ' + data[i].C_ID + ', "C_TITLE" : "' + data[i].C_TITLE + '", "C_PARENT" : ' + data[i].C_PARENT + ', "C_STATUS" : "' + data[i].C_STATUS + '"},';
}
}
result += ']}]';
result = result.replaceAll("},]", "}]");
var a = JSON.parse(result);
document.getElementById('result').innerHTML = result + "<br/><br/><br/>" + a;
String.prototype.replaceAll=函数(搜索、替换){
返回此.replace(新的RegExp(搜索'g'),replacement);
};
var data=JSON.parse(“[{”C_ID“:1.0,“C_TITLE:“sparkers”,“C_PARENT”:0.0,“C_STATUS:“Active”},{”C_ID“:2.0,“C_TITLE:“Twinklers”,“C_PARENT”:0,“C_STATUS:“Active”},{”C_ID“:3.0,“C_TITLE:“can烛光”,“C_PARENT”:0.0,“C_STATUS:“Active”},{”C"C_ID:4.0,“C_TITLE:“Chakkars”,“C_PARENT”:0.0,“C_状态”:“活动”},{“C_ID”:5.0,“C_标题”:“彩色Chakkars”,“C_父项”:4.0,“C_状态”:“活动”},{“C_ID”:6.0,“C_标题”:“花式Chakkars”,“C_父项”:4.0,“C_状态”:“活动”},{“C_ID”:7.0,“C_标题”:“喷泉”,“C_父项”:0.0,“C_状态”:“活动”},{“C_ID”:8.0,“C_标题”:“吹口哨的喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:9.0,“C_标题”:“花式喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:10.0,“C_标题”:“花式色彩喷泉”,“C_家长”:7.0,“C_状态”:“活跃”},{“C_ID”:11.0,“C_标题”:“火箭”,“C_家长”“:0.0,“C_状态”:“活动”}]”;
var结果='[';
对于(i=0;i
+a;
你的数据是一个对象数组吗?谢谢你的回复。是的,我的数据是一个对象数组可能与@TadeášPeták重复。我尝试了但没有成功。你的数据是一个对象数组吗?谢谢你的回复。是的,我的数据是一个对象数组可能与@TadeášPet k重复。我尝试了但没有成功。谢谢你的回复。事实上,我正在使用打字脚本。我刚刚使用了var data=JSON.parse(菜单列表);我在JSON中的位置1Rember处发现了这个错误,您可以在Internet Explorer、Firefox或Chrome上调试它,方法是按“F12”并转到第三个选项卡,您可以在js文件中设置断点,按“F5”重新加载并查看导致此错误的原因,可能是因为一个格式错误的字符串或一些构建错误的东西。现在,我使用以下行var data=JSON.parse(JSON.stringify(c.JSON())修复了这个问题;我正在使用typescript。我得到另一个错误,类型“String”上不存在属性“replaceAll”。如何解决此问题?只需添加
String.prototype.replaceAll=function(search,replacement){返回此值。replace(新的RegExp(search,'g'),replacement)代码>是字符串类属性“replaceAll”的改进,类型“String”上不存在该属性。感谢您的回复。实际上,我正在使用typescript。我刚刚使用了var data=JSON.parse(菜单列表);我在JSON中的位置1Rember处发现了这个错误,您可以在Internet Explorer、Firefox或Chrome上调试它,方法是按“F12”并转到第三个选项卡,您可以在js文件中设置断点,按“F5”重新加载并查看导致此错误的原因,可能是因为格式错误的字符串或其他错误的构建现在我用这行代码修复了这个问题