loop objects in array | React

Question

I'm getting a list from the backend. There are 5 objects in my incoming list. I want to loop through only those whose "status" is "6". There is also a "continue" button. I will not show this button depending on the situation.

response

status 3 = invoice paid

status 6 = unpaid invoice

policyInstallmentDtoList: Array(5)
 0: {installmentNumber: 1, amount: 3032, currency: 'USD', status: '3', date: '09-06-2022'}
 1: {installmentNumber: 2, amount: 3032, currency: 'USD', status: '3', date: '09-07-2022'}
 2: {installmentNumber: 3, amount: 3032, currency: 'USD', status: '6', date: '09-08-2022'}
 3: {installmentNumber: 4, amount: 3032, currency: 'USD', status: '6', date: '09-09-2022'}
 4: {installmentNumber: 5, amount: 3032, currency: 'USD', status: '6', date: '09-10-2022'}

js

  const [hiddenControlButtonClass, setHiddenControlButtonClass] = useState('policypaymentinfo__button_container');

  useEffect(() => {
    if (paymentInfoData?.policyInstallmentDtoList?.map((payment) => payment.status)) {
      setHiddenControlButtonClass('hidden');
    } else {
      setHiddenControlButtonClass('policypaymentinfo__button_container');
    }
  }, [paymentInfoData]);

policyInfoData is the name of the incoming list.

I want to loop through the status 6 in the first if block.

html

<PaymentTable variant="edit" paymentList={paymentInfoData} value={value} collectionMethod={collectionMethod} />
<div className={hiddenControlButtonClass}>
  <AS.Button variant="outlined" onClick={handlePayment}>
    Contiune
  </AS.Button>
</div>

hrodric · Accepted Answer · 2022-06-09 11:12:22Z

2

You can do this:

useEffect(() => {
    paymentInfoData?.policyInstallmentDtoList?.forEach(item => {
       if(item.status == '6') {
           setHiddenControlButtonClass('hidden');
       } else {
           setHiddenControlButtonClass('policypaymentinfo__button_container');
       }
     })
  }, [paymentInfoData]);

answered Jun 9, 2022 at 11:12

hrodric

4353 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

loop objects in array | React

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related