JSX syntax error on PHPStorm

Question

I'm trying to conditionally set a property on a collection of elements.

render: {
   var buttons = [];
   for (var i = 1; i <= this.props.totalWeeks; i++) {
      buttons.push(
         <button 
            onClick={ this.changeWeek.bind(this, i) } 
            disabled={ i === this.state.currWeek }>{ i }
         </button>);
   }
}

Everything works great in the browser. But PHPStorm (version 8.0.3) marks the expression { i === this.state.currWeek } as an error for wrong attribute value .

I've tried changing that with a function call, a variable, etc., but can't seem to make error go away. I've also tried to turn off that inspection rule on PHPStorm, but can't find the one setting that would turn that off.

QUESTION

How can I make that error go away in PHPStorm? If that's a bug, then how can I get rid of that by conditionally adding HTML attributes to a group of elements some other way?

Answer 1

1) If it's render of react (not your custom function), it should be "render() { return ; }" against your code

It's 100% syntax error, browser ignores it, because it should, if you use it in class definition body, syntax is next:

class Test {
    objectExample: { some: "value" }
    functionExample() { return someExecutionCode(); }
    lambdaFunctionExample = () => { return someExecutionCode(); }
}

But you mix 1st and 2nd lines in same time, start as object definition, with body as a function, which are not fits to each other.

2) Your render function NOT return anything, it's making array, but not return it.