RomReed
@RomReed
JavaScript, Flutter, ReactNative, Redux, Firebase

Как программно закрыть DataPicker в Material UI?

Пытаюсь закрыть datapicker с помощью своей функции. В документации не нашёл ничего что могло бы помочь в этом вопросе.
  • Вопрос задан
  • 267 просмотров
Решения вопроса 1
@davidnum95
DatePicker состоит из двух компонентов: TextField и DatePickerDialog. Доступа к DatePickerDialog в контексте DatePicker у вас нет, к тому же состояние диалога хранится в стейте самого компонента, соответственно нужно использовать непосредственно сам DatePickerDialog. У него есть функции для изменения своего стейта: dismiss() и show().
import React from 'react';
import DatePickerDialog from 'material-ui/DatePicker/DatePickerDialog';

export default class SomeComponent extends React.Component {

  constructor(props, context) {
    super(props, context);
    this.closeDatePicker = this.closeDatePicker.bind(this);
    this.openDatePicker = this.openDatePicker.bind(this);
  }

  closeDatePicker() {
    this.datePicker.dismiss();
  }

  openDatePicker() {
    this.datePicker.show();
  }

  render() {
    return (
      <div>
        <button onClick={this.openDatePicker}>Open</button>
        <button onClick={this.closeDatePicker}>Close</button>
        <DatePickerDialog ref={ref => this.datePicker = ref} />
      </div>
    );
  }
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы