javascript - 如何让 JavaScript 在 React 组件中工作

Question

所以我似乎无法在我的组件类之一的 render() 中编译我最内部的 javascript。我的语法是否错误，或者我们不允许在 render() 返回 HTML 中使用 Javascript，并在其中包含更多 Javascript？

我的错误是 SearchBarAndResults.jsx:意外的 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

您只能在 JSX 中嵌入表达式，而不能嵌入语句(如 if)。

您可以执行以下操作之一:

{
  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>);
  }
}()}