Add loading animation until iframe loads in react web app

If iframe loading in React js

class Rsvp extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      loading: true

    };

  }

hideSpinner = () => {

    this.setState({

      loading: false

    });

  };

render() {

    return (

      <div className="container rsvp-wrapper">

        {this.state.loading ? (

          <Spinner

            className="loading text-center"

            name="three-bounce"

            color="white"

            fadeIn="none"

          />

        ) : null}

        <iframe

          src="..."

          width="100%"

          height="700"

          onLoad={this.hideSpinner}

          frameBorder="0"

          marginHeight="0"

          marginWidth="0"

        />

      </div>

    );

  }

}

thank you