在reactjs中有條件地將道具傳遞給組件

Question

我只想在組件完全滿足特定條件后才將props傳遞給組件。 我有這個Paper組件在react中返回render。 我只想在有條件的情況下通過onScroll。

<Paper className={classes.root}  onScroll={this.loadMoreClasses}>

我想實現的目標

<Paper className={classes.root}  organizationname!==null ?onScroll={this.loadMoreClasses} :null>

希望僅當未定義組織名稱時才發生onScroll

Answer 1

您可以像這樣通過它：

<Paper
    className={classes.root}
    onScroll={organizationname !== null ? this.loadMoreClasses : null}
/>

這樣，您的Paper組件會在設置組織名稱時接收onScroll偵聽器，否則不會接收它。 您需要確保Paper組件將onScroll視為可選onScroll ，否則嘗試調用一個不存在的方法時會從中得到錯誤。

一種替代方法是始終提供一個onScroll並將條件移至您的getMoreClasses方法，如果未設置組織名稱，則使其不執行任何操作。