toggle play/pause in react with audio
<p>I have made an audio player, with one button to play and pause. This should perform a play action if the <code>playing</code> is false, and will pause if <code>playing</code> is true.</p>

<p>I am not sure if it is because thinking in React still isn't 100% natural to me, but I cannot figure out how to do this.</p>

<p>Can anyone point me in the right direction?</p>

<p>Please see my code below.</p>

<pre><code>var Player = React.createClass({

   getInitialState: function(){
       return{
           songs:[],
           playing: false
       }
   },

   audio: new Audio,

   playSong: function(){
       this.setState({playing = true});
       this.audio.src = this.state.songs[this.props.song];
       this.audio.play();
   },

   pauseSong: function() {
       this.setState({playing = false});
       this.audio.pause();
   },

  render: function(){
      return(
        &lt;p onClick={...}&gt;Play/Pause&lt;p/&gt;
      )
  }
</code></pre>

<p>I guess I can create another function to toggle play and pause like the following. Is this the best way to do this?</p>

<pre><code>togglePlayPause:function() {
    if(this.state.playing === false) {
        this.playSong();
    }else {
        this.pauseSong();
    }
},
render: function(){
      return(
        &lt;p onClick={this.togglePlayPause}&gt;Play/Pause&lt;p/&gt;
      )
  }
</code></pre>