意外的jxs使用括號和&&

Question

這個jsx有什麼問題？

return(
    {(item.min_price > 0 || item.max_price > 0) && 
     <div className="col-md-12"> 
      {this.renderPrice()} 
    </div>} 
); 

我在第2行

Answer 1

得到了意外的標記如果您刪除curly brackets它將工作。

const item = { 
 
\t min_price: 10, 
 
    max_price: 10 
 

 
} 
 

 
class Test extends React.Component { 
 
\t \t render(){ 
 
    \t return(
 
      (item.min_price > 0 || item.max_price > 0) && 
 
       <div className="col-md-12"> 
 
        <div>Price</div> 
 
       </div> 
 
    ); 
 
    } 
 
} 
 

 
React.render(<Test />, document.getElementById('container'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script> 
 
<div id="container"> 
 
    <!-- This element's contents will be replaced with your component. --> 
 
</div>