カスタムボタンを使用してDatePickerまたはDatePickerDialogを開きます

DatePickerに付属のinputの組み込み以外の外部コントロール/ボタンを使用してDatePickerDialogを開くような方法はありますか？カスタムボタンを使用してDatePickerまたはDatePickerDialogを開きます

私たちはmaterial-uiライブラリを使用しています。

出典

2016-04-14 Nader Dabit

ダイアログopen状態がそれを行うための唯一の方法はDatePickerでrefを使用してfocus()を呼び出すことになる、material-uiコンポーネントによって内部的に処理されているので。ハックのようなもの - それは動作します。..

例：

<DatePicker 
    ref='datePickerStartDate' 
    errorStyle={componentSyles.error} 
    textFieldStyle={componentSyles.textField} 
    DateTimeFormat={Intl.DateTimeFormat} 
    cancelLabel={cancelLabel} 
    autoOk={true} 
    {...this.props} 
    /> 

<FontIcon 
    onClick={(e) => { this.refs.datePickerStartDate.focus() }} 
    className="material-icons" style={componentSyles.icon}> 
    date_range 
</FontIcon>

出典

2016-04-14 16:41:56

ねえ、これは素晴らしい作品、ありがとう。 1つの質問：これは動的に作成された項目のリストで、日付ピッカーが付いています。配列インデックスのコンテキストは常に配列の最後の項目に設定されますが、入力として使用すると機能します良い。正しいインデックスをどのように渡すか？ –

索引をその関数にバインドしようとしましたか？もしそうなら、いくつかのコードを提供できますか？ –

カスタムボタンを使用してDatePickerまたはDatePickerDialogを開きます

答えて

関連する問題