State clicker exercise : who is lucky

import React from 'react';
import Clicker from './Clicker';
import './App.css';

function App() {
  return (
    <div>
      <Clicker />
    </div>
  );
}

export default App;

import React, { Component } from 'react';


class Clicker extends Component {
    constructor(props) {
        super(props);
        this.state = { num: 1 };
        this.genRandom = this.genRandom.bind(this);
    }

    genRandom() {
        //pick rdNum
        let rdNum = Math.floor(Math.random() * 10) + 1;
        //update state
        this.setState({ num: rdNum });
    }

    render() {
        return (
            <div>
                <h1>Number is: {this.state.num}</h1>
                {this.state.num === 7
                    ? < h2 > You Lucky!</h2>
                    : <button onClick={this.genRandom}>Random Number</button>}
            </div >
        );
    }
}

export default Clicker;