Focused.js

import React, { Component } from 'react';
import './App.css';

class App extends Component {
  state = {
    focused: '',
  }
  setFocus = field => this.setState({ focused: field });
  unsetFocus = () => console.log("Unsetting focus");
  isFocused = field => (this.state.focused === field);

  render() {
    return (
      <div className="App">
        <div>
          <label>Name</label>
          <input
            type="text"
            onFocus={() => this.setFocus('name')}
            onBlur={this.unsetFocus}
          />
          <small>{this.isFocused('name') && "Focused on name"}</small>
        </div>

        <div>
          <label>Age</label>
          <input
            type="text"
            onFocus={() => this.setFocus('age')}
            onBlur={this.unsetFocus}
          />
          <small>{this.isFocused('age') && "Focused on age"}</small>
        </div>
      </div>
    );
  }
}

export default App;