React-native - 無限のピッカーを作成する方法

Question

以下の画像のように、無限ループ/反作用のネイティブピッカーを作成したいと思います。

だから、私の質問は： 私はスクロールしてるときに、どのように私は後の最後の項目を伸ばせピッカーが最初の項目から再び始めることができますか？

render() { 
    const hourItems = []; 
    for(var i = 0; i < 24; i++) { 
    hourItems.push(
     <Picker.Item label={i.toString()} value={i} key={i} /> 
    ); 
    } 

    return(
    <ScrollView style={styles.panel}> 
     <Picker 
     selectedValue={this.state.hour} 
     onValueChange={(itemValue, itemIndex) => this.setState({ hour: itemValue })} 
     > 
     {hourItems} 
     </Picker> 
    </ScrollView> 
); 
} 

Answer 1

は分と時間の値をインクリメントReduxのアクションを作成します。

は、ここに私のコードです。そのアクション内には、例えば、それはリセットすべきかどうかを確認することができます。

export const tick =() => (dispatch, getState) => { 
    const { minute } = getState().clock 
    if (minute === 59) { 
    dispatch({ type: RESET_MINUTE}) 
    dispatch({ type: INCREMENT_HOUR}) 
    } else { 
    dispatch({ type: INCREMENT_MINUTE}) 
    } 
} 

と減速中を：

const createReducer = (initialState, handlers) => 
    (state = initialState, action) => { 
    if (handlers.hasOwnProperty(action.type)) { 
     return handlers[action.type](state, action) 
    } 
    return state 
    } 

export default createReducer(initialState, { 
    INCREMENT_HOUR(state, action) { 
    return { 
     ...state, 
     hour: state.hour + 1, 
    } 
    }, 
    INCREMENT_MINUTE(state, action) { 
    return { 
     ...state, 
     minute: state.minute + 1, 
    } 
    }, 
    RESET_MINUTE(state) { 
    return { 
     ...state, 
     minute: 0, 
    } 
    }, 
}) 

、その後減速してあなたのコンポーネントを接続し、アップデートが自動でなければなりません:)

を