Kết xuất có điều kiện trong React

Cách xuất động thứ gì đó so với thứ khác trong React

Trong một JSX thành phần React, bạn có thể tự động quyết định xuất một số thành phần này hay thành phần khác, hoặc chỉ một số phần của JSX, dựa trên các điều kiện.

Cách phổ biến nhất có lẽ là toán tử bậc ba:

const Pet = (props) => {
  return (
    {props.isDog ? <Dog /> : <Cat />}
  )
}

Một cách khác, sẽ hoạt động hiệu quả khi bạn có mộtifnhưng không phải là mộtelselà sử dụng&&, hoạt động theo cách này: nếu biểu thức trước nó cho giá trị là true, nó sẽ in biểu thức sau nó:

const Pet = (props) => {
  return (
    {props.isDog && <Dog />}
    {props.isCat && <Cat />}
  )
}

Tải xuống miễn phí của tôiSổ tay React


Các hướng dẫn về phản ứng khác: