Double sort list in react-native

user_1145680 0
Viewed 53

I'd like to know how to "double sort" items in react native in order to obtain a double criteria sorted list.

The data I receive from BE is a list of match: every match is an object containing 2 players, a time and a competition.

I d'like to sort items by time (so that a today match is showed before a tomorrow match) and by competition (so that a more important competition is showed before a lower one).

If two or more matches are played on the same day and within the same competition, the earlier match is showed before.

A schema better shows what I mean: I'd like to customize the UI oc the day-row, the competition-row and the match-row.

enter image description here

The data I receive from BE are formatted in this way:

enter image description here

How could I obtain what I want? I've tried with sortable list but with no result.

TY in advance

react-native-flatlist react-native javascript
2 Answers

The javascript docs for sort show that you can sort using an arbitrary function. I would write a function which first compares days and then compares competitions:

function compareByDayThenByCompetition(a, b) {
  if (a.day < b.day) {
    return -1;
  }
  if (a.day > b.day) {
    return 1;
  }
  return a.competition - b.competition;
}

events = [{day:3, competition:2}, {day:3, competition:3}, {day:3, competition:1}, {day:2, competition:1}]
console.log(events.sort(compareByDayThenByCompetition))

user_184275570

The best way to filter such data is.

  1. Filter the complete list and make an array of object the object should be grouped by same timestamp. 2)Now iterate the filtered object array and filter the object value.
user_64676280
Related