Golang React JS Technology Blog

How to perform computation inside expression using ternary operator?

Expressions can be used for any computation, below example uses the ternary operator to determine whether length and breadth are equal or not. Based on that identify it is square or rectangle and also calculate area of that.

Example

import React, { Component } from 'react';
 
const length = 10, breadth = 20;
 
class App extends Component {
  render = () => 
  <span class="d-block p-2 bg-dark text-white">
    Area of { length == breadth ? "Sqaure" : "Rectangle" }: { length * breadth}
  </span>
}
 
export default App;
Most Helpful This Week
Getting Started with React and Hello World Example State and Props in React How to get a clicked HTML element in React? Loop inside React JSX Embed JavaScript Expressions in JSX React Components How to use createElement in React JS? React JSX React JS update Div content on click How to handle events using expressions inside JSX?