【问题标题】:Json to Javascript Object ArrayJson 到 Javascript 对象数组
【发布时间】:2020-07-11 04:01:39
【问题描述】:

我正在尝试创建一个 javascript 对象作为引导树视图的输入。我有从 mysql 和 json 获取数据的 php 将结果编码为以下结构:

{"Company 1":{"Production":["Brands","Categories","Products","Stocks"],"Sales":["Customers","Orders","Staffs","Stores"]},"Company 2":{"Production":["Brands","Categories","Products","Stocks"],"Sales":["Customers","Orders","Staffs","Stores"]}}

生成该 json 的 PHP 代码:

$databases=[];
foreach($result as $row){
$database=$row["database"];
$schema=$row["schema"];
$table=$row["object"];
if(!array_key_exists($database, $databases))
    $databases[$database]=[];
if(!array_key_exists($schema, $databases[$database]))
    $databases[$database][$schema]=[];
array_push($databases[$database][$schema], $table);
}

echo json_encode($databases);

但我正在努力将该 json 结构放入所需的 JavaScript 对象的嵌套数组中。下面是所需的结构:

[ { text: "Company 1", nodes: [ { text: "Production", nodes: [ { text: "Brands" }, { text: "Categories" }, { text: "Products" }, { text: "Stocks" } ] }, { text: "Sales", nodes: [ { text: "Customers" }, { text: "Orders" }, { text: "Staffs" }, { text: "Stores" } ] } ] }, { text: "Company 2", nodes: [ { text: "Production", nodes: [ { text: "Brands" }, { text: "Categories" }, { text: "Products" }, { text: "Stocks" } ] }, { text: "Sales", nodes: [ { text: "Customers" }, { text: "Orders" }, { text: "Staffs" }, { text: "Stores" } ] } ] } ];

任何建议将不胜感激

【问题讨论】:

  • 如果可以显示PHP数组$result,那么我们就很容易弄清楚数组的结构以及如何操作它了。

标签: javascript php json


【解决方案1】:

我建议使用递归 flatItem 函数来做到这一点。 我还介绍了一个 array_map_with_keys 辅助函数,因为 PHP 自己的 array_map 函数忽略键,在你的情况下,我们需要它。


function array_map_with_keys($callback, $array){
  return array_map($callback, array_keys($array), $array);
}

function flatItem($key, $value) {
  if(is_array($value)){
    return 
      ["text" => $key,
       "nodes" => array_map_with_keys("flatItem", $value)
      ];  
  }else{
    return ["text" => $value];
  }
}

$converted = array_map_with_keys("flatItem", $databases);

echo json_encode($converted);

结果如你所愿:

[{"text":"Company 1","nodes":[{"text":"Production","nodes":[{"te
xt":"Brands"},{"text":"Categories"},{"text":"Products"},{"text":
"Stocks"}]},{"text":"Sales","nodes":[{"text":"Customers"},{"text
":"Orders"},{"text":"Staffs"},{"text":"Stores"}]}]},{"text":"Com
pany 2","nodes":[{"text":"Production","nodes":[{"text":"Brands"}
,{"text":"Categories"},{"text":"Products"},{"text":"Stocks"}]},{
"text":"Sales","nodes":[{"text":"Customers"},{"text":"Orders"},{
"text":"Staffs"},{"text":"Stores"}]}]}]

你可以把它传递给js。

【讨论】:

  • 太棒了,非常感谢。 array_map_with_keys 函数很聪明。
【解决方案2】:

const data = {
  "Company 1": {
    "Production": ["Brands", "Categories", "Products", "Stocks"],
    "Sales": ["Customers", "Orders", "Staffs", "Stores"]
  },
  "Company 2": {
    "Production": ["Brands", "Categories", "Products", "Stocks"],
    "Sales": ["Customers", "Orders", "Staffs", "Stores"]
  }
}

function converter(data) {
  return Object.entries(data).reduce((converted, [key, val]) => {
    const element = {
      text: key,
      nodes: [...Object.entries(val).map(([key2, val2]) => {
        return {
          text: key2,
          nodes: [...Object.values(val2).map(val3 => {
            return {
              text: val3
            }
          })]
        }
      })]
    }
    converted.push(element);
    return converted
  }, []);
}

console.log(converter(data))

【讨论】:

  • 很棒的 JS 解决方案!只选择了PHP方案,因为我宁愿在服务器端做,但我肯定会从中学习并在其他场景中使用它
猜你喜欢
  • 1970-01-01
  • 2023-03-26
  • 1970-01-01
  • 2014-01-09
  • 2012-10-07
  • 1970-01-01
  • 2020-03-31
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多