If true：render <tr>，else：do not render that <tr>

Question

如何仅在pricePerMeter可用时渲染pricePerMeterTr？

我尝试了let pricePerMeterTr = ””，但是那样渲染了一个范围并且抛出了一个错误。 当它被设置为let pricePerMeterTr = <tr><td></td></tr>;我没有得到任何错误，但它呈现<tr>，我不希望它做。

render() { 

    const { someValue, pricePerMeter } = this.state.inputValues; 

    let pricePerMeterTr = <tr><td></td></tr>; 

    if(pricePerMeter) { 
     pricePerMeterTr = (<tr> 
      <td className="text-medium">Pris per m<sup>2</sup></td> 
      <td className="text-right">{pricePerMeter} kr</td> 
     </tr>) 
    } 

    return (
     <div className="wrapper-medium hidden-sm-down"> 
     *H2* 
      <table className="table"> 
      <tbody> 
       <tr> 
       <td className="text-medium”>Some label</td> 
       <td className="text-right”>{someValue}</td> 
       </tr> 
       {pricePerMeterTr} 
      </tbody> 
      *table footer* 
      </table> 
     </div> 

    ); 
} 


}; 

Answer 1

尝试null。

let pricePerMeterTr = null