React Native：DatePickerIOS - 他のページから返された後に "Date"値を保持する方法

Question

私はシーンにDatePickerIOSコンポーネントを使用しています。ドキュメントの例は、新しいDate（）を呼び出し、状態を使用してDate値を保存および更新します。だから、別のページに戻ってきたら、時間が変わり、この値をリセットする必要があります。

ドキュメントの使用状況：

static defaultProps = { 
    date: new Date() 
    timeZoneOffsetInHours: (-1) * (new Date()).getTimezoneOffset()/60, 
}; 

state = { 
    date: this.props.date, 
    timeZoneOffsetInHours: this.props.timeZoneOffsetInHours, 
}; 

onDateChange(date) { 
    this.setState({date: date}); 
}; 

render(){ 
    return(
      <View style={styles.wrap}> 
       <View style={styles.datePickerIOS}> 
        <DatePickerIOS 
         date={this.state.date} 
         mode="time" 
         timeZoneOffsetInMinutes={this.state.timeZoneOffsetInHours * 60} 
         onDateChange={this.onDateChange.bind(this)} 
         minuteInterval={10} 
        /> 
       </View> 

私は使用の小道具を試してみて、ローカルストレージにこのデータを永続化します。

static defaultProps = { 
    date: new Date() 
    timeZoneOffsetInHours: (-1) * (new Date()).getTimezoneOffset()/60, 
}; 

state = { 
    date: this.props.date, 
    timeZoneOffsetInHours: this.props.timeZoneOffsetInHours, 
}; 

componentWillMout() { 
    this.props.updateDate(this.props.date) 
} 

onDateChange(date) { 
    this.setState({date: date}); 
    this.props.updateDate(date) 
}; 

render(){ 
    return(
      <View style={styles.wrap}> 
       <View style={styles.datePickerIOS}> 
        <DatePickerIOS 
         date={this.props.alarmConfig.date} 
         mode="time" 
         timeZoneOffsetInMinutes={this.state.timeZoneOffsetInHours * 60} 
         onDateChange={this.onDateChange.bind(this)} 
         minuteInterval={10} 
        /> 
       </View> 

updateDate（日）はアクションです

export function updateDate(date){ 
return { 
    type: "UPDATE_DATE", 
    date: date, 
    } 
} 

export function alarmConfig(state=initialState, action){ 
switch(action.type) { 
    case types.UPDATE_DATE: 
     return { 
      ...state, 
      date: action.date 
     }; 

私はそのように行うならば、alarmConfig.date下の値が文字列であるので、DatePickerIOS日の小道具が必要ですので、私は、エラーを取得します日付タイプ。

私は以下のように変更した場合：

<DatePickerIOS 
     date={this.state.date} 
     mode="time" 
     timeZoneOffsetInMinutes={this.state.timeZoneOffsetInHours * 60} 
     onDateChange={this.onDateChange.bind(this)} 
     minuteInterval={10} 
/> 

をalarmConfig.date下の値は、このような状況を引き起こすどういう理由state.date

と同じ、日付のですか？そして目標を達成するためにコードを変更する方法は？

ありがとうございます。

Answer 1

• あなたは（私はあなたが上記のコードからやっ仮定のように）あなたのReduxのストアに日付を格納している場合、あなたは確かにmapStateToPropsであなたのcompononentの小道具にアプリケーションの状態をマッピングする必要があります。

参照：http://redux.js.org/docs/basics/UsageWithReact.html#implementing-container-components

• あなたのエラーalarmConfig.date is a stringが多分初期状態によって引き起こされるので、あなたのReduxのストアにDateオブジェクトを格納できない理由はありません。あなたのinitialStateの変数はどうなっていますか？

• 日付を文字列としてシリアル化する必要がある場合は、momentjs.comをご覧ください。