|
Use conditional rendering, and since you have no else-case, you can use && instead of a ternary operator for brevity: It works because in JavaScript, true && expression always evaluates to expression, and false && expression always evaluates to false. Therefore, if the condition is true, the element right after && will appear in the output. If it is false, React will ignore and skip it. Thus: <div className={"chartContent"}> {this.state.modalityGraph['nca'] > 0 && <div className={"chart-container"}> <Chart chartType="ColumnChart" data = { this.state.modalityGraph?this.state.modalityGraph.chartData['units']:emptyDataRows } options={chartOptions} graph_id="modalitiesChart" width="100%" height="250px" /> </div> } </div>This will only render JSX if a condition is true. If it is false, React won't render anything. Remember, you have to wrap inline JavaScript expressions in JSX with { … }, you can't just have it inside JSX. Using if/else statements directly in JSX will cause it to be rendered literally as text, which isn't desired. You also can't use them in inline JavaScript expressions because if statements are not expressions, so this won't work: (责任编辑：) |