はネイティブスナップカルーセルに反応：不変違反：inputRangeは単調私はネイティブ反応させるために非常に新しいだと私は、このコンポーネントを使用しようとしているのNaN、NaNの場合、NaNの

Question

を増加する必要があります。 https://github.com/archriss/react-native-snap-carousel

私はそのコードを使用してみました最も簡単な作業バージョンを作成するために使用部分に用意されています。

return (
     <Carousel 
      ref={(c) => { this._carousel = c; }} 
      data={this.state.entries} // this seems to be the problem 
      renderItem={this._renderItem} 
      sliderWidth='100%' 
      itemWidth='80%' 
     /> 
    ); 

「エントリ」は配列です。これは、次のエラーが発生：

Invariant Violation: inputRange must be monotonically increasing NaN,NaN,NaN 

編集：ここでは_renderItem方法は、私は同じ問題を持っていたと私は単に同様itemHeightを設定することで解決

_renderItem ({item, index}) { 
    return (
     <View style={styles.slide}> 
      <Text style={styles.title}>{ item.title }</Text> 
     </View> 
    ); 
    } 

Answer 1

だ... それはまたのかもしれません問題は、REAにさらに掘る場合

return (
    <Carousel 
     data={this.state.entries} 
     renderItem={this._renderItem} 
     sliderWidth={sliderWidth} 
     itemWidth={sliderWidth} 
     itemHeight={itemHeight} 
    /> 
); 
const sliderWidth = Dimensions.get('window').width; 
const itemWidth = Dimensions.get('window').height; 

Answer 2

..あなたは、画面への相対的なサイズとして幅と高さを指定しようとすると、それだけの数がかかる場合がありますから来ていますct-nativeソースコードの場合、ファイルAnimatedInterpolation.jsにはerror sourceがあり、補間のためのinputRangeが数値の配列であると予想されます。だから私の最高の推測は反応ネイティブスナップカルーセルはitemWidth値を使用して補間データを計算し、それを反応ネイティブのアニメーションコンポーネントに渡すことです。その実装はhereにあります。整数以外の値をitemWidthに指定すると、計算では常にNaNが返され、そのエラーが作成されます。

短い回答：itemWidthを実際の番号に置き換えてください。