How to add class on first record in array using Reactjs

Question

I am working in Reactjs and using Nextjs,I am trying to add class(active) on "first id"/array first record (fetching from db) but right now working with statically "where id=1" instead of First record,How can i do this ? in other words i want to add active on "first record(in array)" not "where id=1", I tried with following code

{this.state.trending.map((post, index) => {
      return (
                <>
                <div className={`carousel-item ${post.id == 1 ? 'active' : ''}`}>
            )
       })}

[Does this answer your Q ?](https://stackoverflow.com/questions/74471417/how-to-conditionaly-add-class-in-reactjs/74471465#74471465) — KcH, Nov 18 '22 at 11:40

score 0 · Answer 1 · answered Nov 18 '22 at 11:40

0

Use index instead of post.id. Compare it to 0 instead of 1 and you should be just fine.

this.state.trending.map((post, index) => (
  <div className={`carousel-item ${index === 0 ? 'active' : ''}`}>
)

answered Nov 18 '22 at 11:40

AbsoluteZero

401
7

score 0 · Answer 2 · answered Nov 18 '22 at 11:57

0

Try this

this.state.trending.map((post, index) => (
  <div className={"carousel-item"+((index == 0)? 'active':'')}>
)

answered Nov 18 '22 at 11:57

Saqib Ali

31
2

How to add class on first record in array using Reactjs

2 Answers2