React Cookbook

How to do it...

This recipe is straightforward, and the goal is to bind a method using the class constructor and using arrow functions:

1. Let's create a new component called Calculator. We will create a basic calculator with two inputs and one button. The skeleton of our component is as follows:

  import React, { Component } from 'react';  import './Calculator.css';  class Calculator extends Component {    constructor() {      super();      this.state = {        number1: 0,        number2: 0,        result: 0      };    }    render() {      return (        <div className="Calculator">          <input             name="number1"             type="text"             value={this.state.number1}           />          {' + '}          <input             name="number2"             type="text"             value={this.state.number2}           />                    <p><button>=</button></p>          <p className="result">{this.state.result}</p> ...