title: Changing react state based on number
body: <p>I'm new to react and am trying to change my component based upon the state. Having the state as a number works perfectly, but I'm not sure why I'm not able to incease or decrease their values</p>
  
  <pre><code>componentWillMount() {
      this.setState({
          userPrize: 1
      })
  }
  
  nextPrize() {
      this.setState(userPrize: this.state.userPrize + 1);
  }
  
  previousPrize() {
      this.setState(userPrize: this.state.userPrize - 1);
  }
  
  
  render() {
          switch(this.state.userPrize) {
              case 1:
                  return &lt;Prizes userPrize={this.state.userPrize} nextPrize={ this.nextPrize() } previousPrize={ this.previousPrize() } /&gt;
              case 2:
                  return &lt;Prizes userPrize={this.state.userPrize} nextPrize={ this.nextPrize() } previousPrize={ this.previousPrize() } /&gt;
              case 3:
                  return &lt;Prizes userPrize={this.state.userPrize} nextPrize={ this.nextPrize() } previousPrize={ this.previousPrize() } /&gt;
              case 4:
                  return &lt;Prizes userPrize={this.state.userPrize} nextPrize={ this.nextPrize() } previousPrize={ this.previousPrize() } /&gt;
              case 5:
                  return &lt;Prizes userPrize={this.state.userPrize} nextPrize={ this.nextPrize() } previousPrize={ this.previousPrize() } /&gt;
              default:
                  throw new Error("Unknown prize state");
          }
    }
  </code></pre>
  
  <p>I'm not sure if you can change a state using the state in the function the way that I have? I have tried a few different ways but keep getting syntax errors, e.g. unexpected token inside the next and previousPrize functions. As I'm still getting used to react, I'm also wondering if this is the best practice way to pass down the state to change component as well? </p>