Question

我一直在尝试按日期对de JSON数据进行分组，并使用相同的日期增加类似值。但是，我无法弄清楚如果它们具有相同的日期，如何对部件进行编码，并在相同的日期增加喜欢的部分。

这是JSON数据。

{
  "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
  "commit": {
    "committer": {
      "name": "Evan You",
      "date": "2016-04-21T02:44:19Z"
    },
    "message": "update circle.yml",
    "comment_count": 0
  }
},

{
  "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
  "commit": {
    "committer": {
      "name": "yyx990803",
      "date": "2016-04-18T17:34:15Z"
    },
    "message": "add \"propsData\" option",
    "comment_count": 0
  }
},

{
  "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
  "commit": {
    "committer": {
      "name": "phanan",
      "date": "2016-04-18T10:11:10Z"
    },
    "message": "Fix data functions being called twice.",
    "comment_count": 0
  }
}

就像github提交列表一样：https://github.com/vuejs/vue/commits/dev

Apr 21, 2016
.allow local sauce runs to have the same job id
.update circle.yml

Apr 19, 2016
.warn against incorrect propsData usage

Answer 1

虽然我可能会建议处理这个数据服务器端并使用已按日期分组的提交日志返回它，但这里是一个带有一些有限jQuery的javascript实现。

HTML：

<ul id="commits"></ul>

的javascript：

// a static example of your json data
var json = [

    {

        "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
        "commit": {
            "committer": {
                "name": "Evan You",
                "date": "2016-04-21T02:44:19Z"
            },
            "message": "update circle.yml",
            "comment_count": 0
        }

    }, 
    {

        "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
        "commit": {
            "committer": {
                "name": "yyx990803",
                "date": "2016-04-18T17:34:15Z"
            },
            "message": "add \"propsData\" option",
            "comment_count": 0
        }
    }, 
    {
        "sha": "2c64dae512cb302d99437a0fc84f1ba1ef341892",
        "commit": {
            "committer": {
                "name": "phanan",
                "date": "2016-04-18T10:11:10Z"
            },
            "message": "Fix data functions being called twice.",
            "comment_count": 0
        }

    }

],
// an object to store key/pair date and grouped message data
commits = {}, 
// ul dom element where we'll append the generate html list items
commitList = $("#commits"),
// we'll create an html blob of all the li elements to 
// limit the amount of times we hit the dom
listHtml = "";

// loop through json data
for (item in json) {

    // get raw date information 
    // then get just the date as a string (e.g. Wed Apr 20 2016)
    var date = new Date(json[item].commit.committer.date),
        dateString = date.toDateString();

    // check to see if we have already added this date to our commit object
    // if yes, push the message value to the associated array
    // if no, create a new array for the respective date and add the first message
    if(commits[dateString]){
        commits[dateString].push(json[item].commit.message);
    } else {
        commits[dateString] = [json[item].commit.message];
    }

}

// loop through grouped commit message object, and create an html blob
// of li elements
for(commit in commits){

    listHtml += "<li>";
    listHtml += "<p>" + commit + "</p>";
    listHtml += "<div>";

    for(var i = 0; i < commits[commit].length; i++){

        listHtml += "<p>" + commits[commit][i] + "</p>";

    }

    listHtml += "</div>";

}

// append the html blob of li elements
commitList.append(listHtml);

这是一个有工作版本的小提琴：

https://jsfiddle.net/joeydehnert/9hk123ne/

JSON数据组在javascript中的相同日期

1 个答案: