So erhalten Sie JavaScript in React-Komponente

Question

zu arbeiten So scheint es nicht in der Lage zu sein, meine innerste Javascript zu kompilieren in der render() einer meiner Komponenten-Klassen zu bekommen. Habe ich meine Syntax falsch oder ist es nicht erlaubt, Javascript in der render() return HTML mit mehr Javascript innerhalb?

Mein Fehler ist SearchBarAndResults.jsx: unerwartetes Token (57:12)

render() { 
    let recievedContracts = this.props.passedContracts.recievedContracts; 
    if (!recievedContracts) { 
     return (
     <div> 
      <h3>'Still waiting for JSON Response'</h3> 
     </div> 
    ); 
    } else {  
     const allMemberContractsInfo = this.props.passedContracts.allMemberContractsInfo; 
     return (
     <div> 
      <h3>'allMemberContractsInfo Have Arrived on the Client Side!'</h3> 

      <Button> 
      <a href='http://www.adnxs.net/' target="_blank">New Bidder</a> 
      </Button> 

      { 
      if (2 === (3 -1)) { // <============= line 57 
       return (<h1>1 does equal 1</h1>); 
      } else { 
       return (<h1>1 does not equal 1</h1>); 
      } 
      } 
      // other code... 

Answer 1

können Sie betten nur Ausdrücke innerhalb JSX, keine Aussagen (wie if).

Sie können eine von ihnen tun:

{ 
    2 === (3 - 1) ? 
    <h1>1 does equal 1</h1> : 
    <h1>1 does not equal 1</h1> 
} 

{function() { 
    if (2 === (3 - 1)) { 
    return (<h1>1 does equal 1</h1>); 
    } else { 
    return (<h1>1 does not equal 1</h1>); 
    } 
}()} 

Answer 2

Sie sollten es in JSX Aussage als Ausdruck für die Verwendung neu zu schreiben.

{ 
    2 === (3 -1) 
    ? <h1>1 does equal 1</h1> 
    : <h1>1 does not equal 1</h1>; 
}