前端之家

  1. 首页
  2. 问答

如果JSON值相同，则按特定值对JSON进行排序，按排序键对组密钥进行排序

• 问答

我想按日期对JSON排序，如果特定日期有多个条目，请将它们全部归为特定日期。

这是我的JSON： 

[ 
   { 
      "id":"3","time":"20:00","hometeam":"AC Milan","awayteam":"Juventus","prediction":"Under 2.5","odds":"1.75","competition":"Serie A","status":"lost","date":"01-11-2019"
   },{ 
      "id":"4","time":"21:00","hometeam":"FCSB","awayteam":"Dinamo","prediction":"Draw","odds":"1.12","competition":"Liga 1","status":"",{ 
      "id":"1","time":"16:00","hometeam":"Chelsea","awayteam":"Arsenal","prediction":"Over 2.5","odds":"1.32","competition":"Premier League","status":"won","date":"31-10-2019"
   },{ 
      "id":"2","time":"18:00","hometeam":"Manchester United","awayteam":"Liverpool","prediction":"1x2","odds":"1.45","date":"31-10-2019"
   }
]
我想按日期排序JSON，然后将每个匹配项按特定日期分组并以HTML显示。到目前为止，我正在显示这4个游戏，但是我要在每个游戏中添加日期。我想要日期，然后是2019年11月11日的2场比赛，再次是日期31-10-2019，然后是2场比赛的其余部分。

这是AJAX和HTML：

function updateList() {			
jQuery.ajax({
type: "GET",url: url
dataType: 'json',timeout: 5000,crossDomain: true,cache: false,success: function(data) {
console.log(JSON.stringify(data));

var groupedData = _.groupBy(data,function(d){return d.date});
//console.log(groupedData);

var htmlText = data.map(function(o){
return `		
<div class="norm"><i class="icon-hourglass-time"></i>${o.date}</div>
<ul class="stage clearfix">
<li class="scene">
	<!-- <div class="trigger"></div> -->
	<div class="face" ontouchend="return true">
		<a class="calendar-hour poster tasklist-gray">
			<div class="max-constrain">
				<div class="first-20">
					<div class="cal-from"><strong>${o.time} <small>GMT</small></strong>
					</div>
				</div>
				<div class="second-45">
					<div class="teams">${o.hometeam}
						<br><small>vs</small>
						<br>${o.awayteam}</div><em><i class="fa fa-map-marker"></i>${o.competition}</em>
				</div>
				<div class="third-35 last-column">
					<div class="over-under">
						<div class="over-under-icon">
							<div class="over-under-text-over uppercase">
								<div class="over-under-number">${o.prediction}</div>
								<div class="odd-number">
								${o.odds}
								</div>
								
							</div>
							<div class="touch-section uppercase"><span class="statusValue">${o.status}</span></div>
						</div>
					</div>
				</div>
			</div>
		</a>
		<div class="info">
			<div class="result-top-unch uppercase"><i class="fa fa-pause"></i>…</div>
		</div>
	</div>
</li>
</ul>
`;
});

jQuery('.container-fullscreen').append(htmlText);

},error: function(data) {
console.log(JSON.stringify(data));
}
});
}

感谢您的帮助！

lanyangyang1 回答：如果JSON值相同，则按特定值对JSON进行排序，按排序键对组密钥进行排序

实际上，您想要做的事情必须分两个步骤完成。

首先，按日期对对象进行分组，因为lodash已存在于代码中，所以可以使用lodash进行操作。

使用ES6方法，您可以通过定义以下函数来做到这一点：

function groupBy(list,keyGetter) {
    const map = new Map();
    list.forEach((item) => {
         const key = keyGetter(item);
         const collection = map.get(key);
         if (!collection) {
             map.set(key,[item]);
         } else {
             collection.push(item);
         }
    });
    return map;
}

它带有两个参数：您的数组和用于验证应该对数据进行分组的属性的函数。

matchMap = groupBy(foo,match => match.date)

您在SO上有很多可用的示例，我检查了this post

然后，您只需要按日期对数组进行排序：

let matchArray = Array.from(matchMap )

const sortedArray = matchArray.sort( (a,b) => {

    const dateArrayA = a[1][0].date.split('-');
    const dateArrayB = b[1][0].date.split('-');
    return new Date(dateArrayA[2],dateArrayA[1]-1,dateArrayA[0]) > new Date(dateArrayB[2],dateArrayB[1]-1,dateArrayB[0])
})

由于date属性不是有效日期，而是字符串，因此在比较不同条目时必须重新构造它。

然后，结果将是一本以日期为键并由其排序的字典。

编辑 提取数据：

for(i=0;i<matchArray.length;i++)
{
    for(j=0;j<matchArray[i][1].length;j++){
    const currentMatch = matchArray[i][1][j];
    //Your display logic
  }

}

希望有帮助！

htmljavascriptjqueryjson
本文链接：https://www.f2er.com/3169841.html

大家都在问