Как я могу найти наибольшее и наименьшее числа в массиве объектов и изменить CSS этого объекта при его отображении в React

#reactjs

#reactjs

Вопрос:

Вот макет того, как выглядят мои данные, и 3 одинаковых компонента.

 const players = [
    { Fplprice: 7},
    { Fplprice: 4},
    { Fplprice: 10}
];

var largest = Math.max.apply(Math, players.map(function(o) {return o.Fplprice}));
console.log("Largest number is ", largest);

var longest = players.sort(function(a, b) {return a.Fplprice - b.Fplprice})
console.log("Longest number is ", longest);


Return (
<component prop={players[0]}>
<component prop={players[1]}>
<component prop={players[2]}>
)
 

Я хочу иметь возможность находить максимальное и минимальное значение массива объектов, затем передавать эту информацию дочерним компонентам и отображать наибольшее число зеленым цветом, например, и красным для наименьшего числа.

Комментарии:

1. сначала отсортируйте массив, а затем используйте его по своему усмотрению players.sort((a,b) => a.Fplprice - b.Fplprice) , тогда последний элемент будет максимальным

2. Поскольку вы не показали, что вы пытались, я могу предоставить только начальный указатель , который поможет вам добраться до решения.