How to display an element from a true or false within the Object? Javascript Reactjs

Asked

Viewed 144 times

2

i have an array of objects, and I want to display the value from their status which is an attribute within the object.

this.state = {
  objetcs: [{
    value: 1,
    status: false
  }, {
    value: 2,
    status: true
  }]
}
}

// const object = [{ value: 1, status: false }, {value: 2, status: true} ]

If the status for true I re-dress it, if not, I re-dress it.

How can I do that ?

javascript react

1 answer

2


You can use .filter to filter the state and then map to the JSX you need.
Notice that in your States you have written Objects objetcs, I corrected in the example below

class Componente extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      objects: [{
        value: 0,
        status: true
      }, {
        value: 1,
        status: false
      }, {
        value: 2,
        status: true
      }]
    }
  }

  render() {
    const activeElements = this.state.objects
      .filter(obj => obj.status)
      .map(obj => (<p>{obj.value}</p>));
    return (<div>{activeElements}</div>);
  }
}

ReactDOM.render( <Componente/> , document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>

Browser other questions tagged javascript react

You are not signed in. Login or sign up in order to post.