React에는 다음과 같은 객체가 있습니다.
shirt : {
title : "Abc",
material : "cotton",
options : [
0 : {
price: 10,
color: red
},
1 : {
price: 20,
color: green
},
2 : {
price: 30,
color: blue
},
}
카탈로그 페이지 에서 모든 셔츠에 대해 가장 저렴한 옵션 ( "$ 10부터") 만 표시하고 싶습니다 .
모든 셔츠를 표시하려면지도 기능을 사용합니다.
shirts.map((shirt) => (<div>{shirt.title}</div><div>{shirt.material}</div>))
가장 저렴한 가격 만 표시하려면 어떻게해야합니까?
{shirt.options.price[0]}
배열의 첫 번째 요소가 항상 가장 저렴한 가격이 아니기 때문에 사용할 수 없습니다 .
다음과 같이 할 수 있습니다.
const minPrice = Math.min(...shirt.options.map(({price}) => price))
const cheapeastShirt = shirt.options.find({price} => minPrice === price)
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다