Mapping through an array and Routing

Question

I have an array of objects like below -

const studentDetails = [
    {id:1, name:"Mike", stream:"Science", status:"active"},
    {id:2, name:"Kelly", stream:"Commerce", status:"inactive"},
    {id:3, name:"Bob", stream:"Law", status:"inactive"},
]

What I want to do is map through the array and route to another page when the status is inactive.

studentDetails.map(studentDetail => {
    if(studentDetail.status === 'inactive'){
        router.push("/pageB")
    }
})

My doubt here is that when we route to pageB when the id is 2, how will I continue the loop for id=3

Many Thanks

Do you want not to refresh the page while in the map loop? — Maxali
– Maxali, Commented Nov 15, 2022 at 19:00

Maxali · Accepted Answer · 2022-11-15 19:16:43Z

1

Find the first inactive user using Array.find instead of Array.map

const studentDetails = [
    {id:1, name:"Mike", stream:"Science", status:"active"},
    {id:2, name:"Kelly", stream:"Commerce", status:"inactive"},
    {id:3, name:"Bob", stream:"Law", status:"inactive"},
]

let inactiveUser = studentDetails.find(user => user.status === "inactive");

console.log(inactiveUser);

// inactiveUser can be null, so we have to check first.
if (inactiveUser) router.push("/pageB");

edited Nov 15, 2022 at 19:16

answered Nov 15, 2022 at 19:10

Maxali

1,9922 gold badges16 silver badges25 bronze badges

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

6 Comments

Mohit Chauhan Over a year ago

What I really want to do is for each item in an array for which the status is inactive, I want to route to pageB

Maxali Over a year ago

You have two inactive users. Do you want to router.push for both users?

Mohit Chauhan Over a year ago

Yes, also there can be many inactive users, but for simplicity, I have used only 3 items in an array

Maxali Over a year ago

That means, the first router.push will navigate to pageB which i think makes the next router.push useless. Do you mean to navigate to pageB and send all inactive users at the sametime.

Mohit Chauhan Over a year ago

No, I want to route to pageB one at a time

|

Tomas Deans · Accepted Answer · 2022-11-15 19:02:01Z

0

I'm wondering why that {id:3, status:"inactive"} is needed. You can omit that code if it is the same as the other one except id. Like this:

const studentDetails = [
    {id:1, status:"active"},
    {id:2, status:"inactive"}
]

answered Nov 15, 2022 at 19:02

Tomas Deans

12 bronze badges

1 Comment

Mohit Chauhan Over a year ago

it is required. actually it is a big object but for simplicity I have used only two properties. I will add more

Collectives™ on Stack Overflow

Mapping through an array and Routing

2 Answers 2

6 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related