如何在ReactJS中不使用if-else語句實現條件渲染？

ReactJS 中的條件渲染：JSX 中的if-else 語句

在ReactJS 中，if-else 語句不能直接在JSX 表達式中使用。這是由於 JSX 的性質決定的，JSX 是用於創建 JavaScript 函數呼叫和物件的語法糖。

要依照狀態有條件地渲染元素，還有其他方法：

三元運算子：

使用三元運算符計算條件並根據結果渲染不同的元素，如圖所示下面：

render() {
    return (   
        <View>

函數呼叫：

建立一個計算if-else 邏輯並傳回適當元素的函數。然後，從 JSX 表達式中調用函數：

renderElement(){
   if(this.state.value == 'news')
      return data;
   return null;
}

render() {
    return (   
        <View>

透過利用三元運算子或函數調用，您可以有條件地渲染 ReactJS 中的元素，而無需修改場景或使用選項卡。

以上是如何在ReactJS中不使用if-else語句實現條件渲染？的詳細內容。更多資訊請關注PHP中文網其他相關文章！