Coffeescript - React setState not rendering after click

Question

I am trying to change the text of a button when the user clicks on it.

The state changes but, the component does not seem to re-render

However, when I put the state in the upper level (in the outer if statement), the components text does change (but it would be in a separate view). I need to keep that component in that else if clause

Am I missing something or does this not work? I am still learning react and don't understand the whole concept of state and the deeper levels of state changes

render: ->

    if @state.couponSet == true and @state.couponSuccess != true
      div {},
        "Some view"
    else if @state.couponMode != true and @ state.couponSuccess != true
        div { className: "container" },
                SelectButton
                  clickHandler: @onSelectPlan.bind(null, this, 0)
                  wrapperClassName: 'button-wrapper'
                  className: 'plan-select'
                  buttonText: if @state.planSelected == true then "Selected" else "Select"
    else
        ...

And in onSelectPlan

onSelectPlan: (e, plan) ->
    if plan == 0
        @setState planSelected: true

Answer 1

Your "bind" looks wrong. You probably don't need the "bind" at all -- just use a fat arrow:

SelectButton
  clickHandler: (e, plan) =>
    if plan is 0
      @setState planSelected: true