if statement in react.Js with map function-CodePudding

my code got an map function that show item in a list :item that showing in the site

I need to write an if statement that olny show the item that same as the date above

code in react for the map function:

function Feed(props) {

    console.table(props.data);
    const number="";
    return (
      <>
        {
          props.data.map(item=>  (
<>
          <div className="taskcolorback-div" />
          <button className="taskcolor-button" />

          <input className="tasktext-b" defaultValue={item.fields.Title}></input>
          <button className="taskwhite-button" />
          
          <b className="timeinline">{item.fields.Hours}Hr</b>
          <img className="vector-icon" alt="" src="icons8-chevron-right-64.png" />
          </>
          )) 
        }
  
      </>
    )
  }

CodePudding user response：

Please check with this link for more details https://reactjs.org/docs/conditional-rendering.html

CodePudding user response：

You can use ternary operator instead of if statement.

return (
      <>
        {
          props.data.map(item=>  (
              item.display === true ?
                  <div>{Your component Here}</div>
              :
                  <></>
          )) 
        }
  
      </>
    )

CodePudding user response：

// if your item has a date property and it's a string.

const component = /* the component you want to render */

item.fields.date === yourDate ? component :

write some error handling

// at least you need some date data