2016-10-10 5 views
1

react-datetimeを使用していて、過去に日付/時刻を選択できないようにしたい場合は、過去に送信されたDocumentationは、以前に日付を無効にする方法を示していますが、分を無効にしようとしたときに、カレンダーのドロップダウンボックスで手動で変更することができます。下記のコードは大規模な電子メールプラットフォームの一部ですが、スニペットを理解することができるはずです。ファイルの寿命はhereで、レポもそこに表示されます。React.js:過去に変更したときのDateTimeを無効にする

理想的には、過去1分以上の日付または時刻を選択すると、現時点に戻り、現時点で「送信」できるようになります。どんな助けもfabとなるでしょう - ありがとう!

isValidDate(dt) { 
    return (dt >= (moment().startOf('day'))) 
     && (dt <= moment().add(30, 'days')) 
     && moment().subtract(1, 'minute'); 
    } 

は、私はすでに上記を試みたが、まだみましょうあなたが手動で編集:(

class EmailSendDialog extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     listId: null, 
     now: true, 
     date: moment(), 
     tz: this.defaultTz 
    }; 
    } 

    handleDateTimeSelect(date) { 
    this.setState({ date }); 
    } 

    isValidDate(dt) { 
    return (dt >= (moment().startOf('day'))) 
     && (dt <= moment().add(30, 'days')) 
     && moment().subtract(1, 'minute'); 
    } 

をレンダリングするために、私はこれがあります。

 <DateTime 
     value={date} 
     dateFormat="D MMM YYYY" 
     isValidDate={this.isValidDate} 
     onChange={(_date) => this.handleDateTimeSelect(_date)} 
     /> 

答えて

2

クールに - 私は行きますよ私の質問に答えてください)

handleDateTimeSelect(date) { 
    if (date < moment()) { 
     date = moment(); 
    } 
    this.setState({ date }); 
    } 

これは、今現在の状態を設定します。手動で変更しようとしても、元の状態に戻ります。

handleDateTimeSelect(date) { 
    const currentDate = moment(); 
    date = date < currentDate ? currentDate : date; 
    this.setState({ date }); 
    } 

リビジョン
は、計算負荷を軽減するためには、私が最後に以下の使用しました

関連する問題