jsx React 中的嵌套條件渲染

Question

我試圖在 jsx 本身中有一個嵌套的 if 條件。 這是我的代碼示例：

        {this.props.customerInformation?
           <Descriptions title="Customer Information" bordered>
           {this.props.customerInformation.customer_status.label}</Descriptions.Item>
            </Descriptions>
            :
            <Button> Create a new customer </Button>
            }

我試圖做的是在頂級條件中添加另一個條件，看起來像這樣：

            {this.props.customerInformation?
           <Descriptions title="Customer Information" bordered>
          <Descriptions.Item>
           {this.props.customerInformation.customer_status.label}
          </Descriptions.Item>

               <Description.Item>
             {this.props.customerInformation.poc?
              <Descriptions title="poc" > 
              {this.props.customerInformation.poc}
              <Descriptions.Item>
             </Descriptions>
            :
            <Button> Create a new customer </Button>
            }

Answer 1

添加括號來包裝您的代碼。

 {this.props.customerInformation?
           (<Descriptions title="Customer Information" bordered>
              {this.props.customerInformation.customer_status.label} 
               </Descriptions.Item>
            </Descriptions>)
            :
            (<Button> Create a new customer </Button>)
}