簡體   English   中英

解析 json 數組並遍歷 Pivot.js 的所有數據

[英]Parse json array and loop through all the data for Pivot.js

我有一個這種格式的 json 數組數據:

{
  "jobs": [
    {
      "id": "some_random_id_1",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 40,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_2",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 30,
        "rejected": 20
      }
    },
    {
      "id": "some_random_id_3",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    },
    {
      "id": "some_random_id_4",
      "email": "some@email.com",
      "email_type": "html",
      "status": "pending",
      "job_fields": {
        "TITLE": "job title here"
      },
      "stats": {
        "applied": 13,
        "rejected": 1
      }
    }
  ],
  "job_id": "some_id",
  "total_jobs": 60
}

我只需要訪問jobs對象並獲取idstatus以及job_fieldsstats所有信息(或現在的所有信息)。

  // example is from here
  // https://pivottable.js.org/examples/mps.html
  $(function(){
    $.getJSON("data.json", function(mps) {
        $("#output").pivotUI(mps);
    });
 });

該示例適用於這種 json 格式:

[{
    "Province": "Quebec",
    "Party": "NDP",
    "Age": 22,
    "Name": "Liu, Laurin",
    "Gender": "Female"
  },
  {
    "Province": "Quebec",
    "Party": "Bloc Quebecois",
    "Age": 43,
    "Name": "Mourani, Maria",
    "Gender": "Female"
  },
  {
    "Province": "Ontario",
    "Party": "Conservative",
    "Age": "",
    "Name": "O'Toole, Erin",
    "Gender": "Male"
  }
]

我不確定如何修改 javascript 以便它可以讀取我的 json 格式。 我無法修改json格式來匹配上面的格式,所以在上面的javascript例子中, province, party, etc都是傳遞給函數的。

我想用我的 json 格式做同樣的事情,所以輸出id, status, all members of job_fields (ex: TITLE, etc. ), all members of stats (ex: applied, rejected .

假設所有作業都有 job_fields.TITLE、stats.applied 和 stats.rejected 可能會執行以下操作:

 const json = { "jobs": [ { "id": "some_random_id_1", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 40, "rejected": 20 } }, { "id": "some_random_id_2", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 30, "rejected": 20 } }, { "id": "some_random_id_3", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 13, "rejected": 1 } }, { "id": "some_random_id_4", "email": "some@email.com", "email_type": "html", "status": "pending", "job_fields": { "TITLE": "job title here" }, "stats": { "applied": 13, "rejected": 1 } } ], "job_id": "some_id", "total_jobs": 60 }; console.log( json.jobs.map( (job)=>({ id:job.id, status:job.status, title:job.job_fields.TITLE, applied:job.stats.applied, rejected:job.stats.rejected }) ) );

可以嘗試使用以下代碼段:

$(function(){
$.getJSON("data.json", function(orgData) {
    var pivotData = [];
    orgData.jobs.forEach(function (job, ind) {
        var reqInfo = {};
        reqInfo['id'] = job.id;
        reqInfo['status'] = job.status;
        reqInfo['jobTitle'] = job.job_fields && job.job_fields.TITLE;
        reqInfo['applied'] = job.stats && job.stats.applied;
        reqInfo['rejected'] = job.stats && job.stats.rejected;
        pivotData.push(reqInfo)
    })
    $("#output").pivotUI(pivotData);
});

});

您可以使用map並使用Object.assignspread operator來制作對象

 var obj={"jobs":[{"id":"some_random_id_1","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":40,"rejected":20}},{"id":"some_random_id_2","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":30,"rejected":20}},{"id":"some_random_id_3","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}},{"id":"some_random_id_4","email":"some@email.com","email_type":"html","status":"pending","job_fields":{"TITLE":"job title here"},"stats":{"applied":13,"rejected":1}}],"job_id":"some_id","total_jobs":60} var result = obj.jobs.map(({id,status,job_fields,stats}) => { return Object.assign({}, {id}, {status}, {...job_fields}, {...stats}); }); console.log(result);

或者你可以讓它更短,比如:

var result = obj.jobs.map( ({id,status,job_fields,stats}) => Object.assign({},{id},{status},{...job_fields},{...stats}) );
$("#output").pivotUI(mps.jobs);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM