如何将 JSON 数据映射到表/HTML？

Question

我得到的json数据如下：

{

    "encoding_version" : 1,

    "root" : {

        "_type" : lookup_config_data",

        "Class" : ".key.LookData",

        "Tbl" : {

            "_type" : "lookup_table",

            "Class" : ".key.LookupTable",

            "Lhs" : { "_type" : "array<variant>", "_data" : [

                ".key.test1",

                ".key.test2",

                ".key.test3",

                ".key.test4",

                ".key.test5"                

            ] },

            "Groups" : { "_type" : "array<array<key>>", "_data" : [

                { "_type" : "array<key>", "_data" : [

                    ".key.data1",

                    ".key.data12"

                ] },

                { "_type" : "array<key>", "_data" : [

                    ".key.data2"

                ] },

                { "_type" : "array<key>", "_data" : [

                    ".key.data3"

                ] },

                { "_type" : "array<key>", "_data" : [

                    ".key.data4"

                ] },

                { "_type" : "array<key>", "_data" : [

                    ".key.data5"

                ] }

            ] }

        }

    }

}

有没有办法映射如下：

测试1 -> 数据1,数据12

测试2->数据2

测试3->数据3

测试4->数据4

测试5->数据5

请帮忙。

谢谢！

Answer 1

看起来上面的数据有一个预定义的模式。因此，需要注意模式定义的每个语法。但作为起点，您可以使用以下代码。var obj = {&nbsp; "encoding_version" : 1,&nbsp; "root" : {&nbsp; &nbsp; &nbsp; "_type" : "lookup_config_data",&nbsp; &nbsp; &nbsp; "Class" : ".key.LookData",&nbsp; &nbsp; &nbsp; "Tbl" : {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "_type" : "lookup_table",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "Class" : ".key.LookupTable",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "Lhs" : { "_type" : "array<variant>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.test1",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.test2",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.test3",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.test4",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.test5"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "Groups" : { "_type" : "array<array<key>>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; { "_type" : "array<key>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data1",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data12"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; { "_type" : "array<key>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data2"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; { "_type" : "array<key>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data3"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; { "_type" : "array<key>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data4"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; { "_type" : "array<key>", "_data" : [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ".key.data5"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ] }&nbsp; &nbsp; &nbsp; }&nbsp; }};var newObj = {};var keys = obj.root.Tbl.Lhs._data;var values = obj.root.Tbl.Groups._data;if (keys.length == values.length){&nbsp; keys.forEach((e,i)=>{&nbsp; &nbsp; newObj[extractData(e)] = values[i]._data.map(v=>extractData(v));&nbsp; })}function extractData(raw){&nbsp; return raw.split('.')[2];}console.log(newObj);这将是键到值newObj的映射。LhsGroups