RefreshControl pojawia się tylko na pierwszym dziecku w poziomym ScrollView (iOS)

Question

Mam przypadek użycia, w którym chcę wyświetlić karty horyzontalne. Zaimplementowałem to z poziomą ScrollView.

Następnie dla każdej karty chciałbym wprowadzić wzór odciągania do odświeżania, aby dane wyświetlane na karcie były aktualizowane. Użyłem zatem komponentu RefreshControl jako atrybutu ScrollView.

Problem polega na tym, że w systemie iOS, gdy przełączam się na inną kartę niż pierwsza, nie widzę składnika RefreshControl (patrz poniżej: gif).

Kod

<ScrollView 
    contentContainerStyle={styles.container} 
    horizontal 
    pagingEnabled 
    showsHorizontalScrollIndicator={false} 
    directionalLockEnabled 
    contentInset={{top: 1}} 
    refreshControl={ 
    <RefreshControl 
     refreshing={this.state.isRefreshing} 
     onRefresh={this._onRefresh.bind(this)} 
    /> 
    } 
> 
    <Text style={styles.card}>First child</Text> 
    <Text style={styles.card}>Second child</Text> 
</ScrollView> 

Pełny kod w demo poniżej

Demohttps://rnplay.org/apps/sRXpEw

Edycja

Wygląda związany tej części kodu: Libraries/Components/ScrollView/ScrollView.js#L523-L529

Answer 1

O ile mi wiadomo, jest to oczekiwane zachowanie od refreshControl - nie ma być tylko jeden.

Czy to zadziała dla Twojej aplikacji?

<ScrollView 
    contentContainerStyle={styles.container} 
    horizontal 
    pagingEnabled 
    showsHorizontalScrollIndicator={false} 
    directionalLockEnabled 
    contentInset={{top: 1}} 
> 
    <ScrollView 
    refreshControl={ 
     <RefreshControl 
     refreshing={this.state.isRefreshing} 
     onRefresh={this._onRefresh.bind(this)} 
     /> 
    }><Text style={styles.card}>First child</Text></ScrollView> 
    <ScrollView 
    refreshControl={ 
     <RefreshControl 
     refreshing={this.state.isRefreshing} 
     onRefresh={this._onRefresh.bind(this)} 
     /> 
    }><Text style={styles.card}>Second child</Text></ScrollView> 
</ScrollView>