Glenn
10/24/2018 - 8:48 AM

react-jsx-props-example-1

react-jsx-props-example-1

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.4.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.4.2/umd/react-dom.production.min.js"></script>
const el = document.getElementById('app')

class NumberDescriptor extends React.Component {
  constructor(props) {
    super(props)
  }
  
  render () {
    let description
  
    if (this.props.number % 2 === 0) {
      description = <strong>Even</strong>
    } else {
      description = <i>Odd</i>
    }
  
    return <div>{this.props.number} is an {description} number</div>
  }
}


ReactDOM.render(<NumberDescriptor number={1}/>, el)

react-jsx-props-example-1

A Pen by Glenn on CodePen.

License.

<div id="app">
  app not loaded
</div>