title: Add Sweet Alert popup to button in React component
body: <p>I found this perfect Sweet Alert module for Bootstrap and React (which I'm using in my Meteor app):</p>
  
  <p><a href="http://djorg83.github.io/react-bootstrap-sweetalert/" rel="noreferrer">http://djorg83.github.io/react-bootstrap-sweetalert/</a></p>
  
  <p>But I don't understand how you include this code inside a React component. </p>
  
  <p>When someone clicks the Delete button in my app, I'd like a Sweet Alert prompt to pop up asking for confirmation.</p>
  
  <p>Here is my component for the Delete button:</p>
  
  <pre><code>import React, {Component} from 'react';
  import Goals from '/imports/collections/goals/goals.js'
  import SweetAlert from 'react-bootstrap-sweetalert';
  
  export default class DeleteGoalButton extends Component {
  
    deleteThisGoal(){
      console.log('Goal deleted!');
      // Meteor.call('goals.remove', this.props.goalId);
    }
  
    render(){
      return(
        &lt;div className="inline"&gt;
            &lt;a onClick={this.deleteThisGoal()} href={`/students/${this.props.studentId}/}`}
            className='btn btn-danger'&gt;&lt;i className="fa fa-trash" aria-hidden="true"&gt;&lt;/i&gt; Delete Goal&lt;/a&gt;
        &lt;/div&gt;
      )
    }
  }
  </code></pre>
  
  <p>And here is the code that I copied from the Sweet Alert example:</p>
  
  <pre><code>&lt;SweetAlert
      warning
      showCancel
      confirmBtnText="Yes, delete it!"
      confirmBtnBsStyle="danger"
      cancelBtnBsStyle="default"
      title="Are you sure?"
      onConfirm={this.deleteFile}
      onCancel={this.cancelDelete}
  &gt;
      You will not be able to recover this imaginary file!
  &lt;/SweetAlert&gt;
  </code></pre>
  
  <p>Anyone know how to do this?</p>