Как настроить заголовок месяца и года в датах реагирования - PullRequest
0 голосов
/ 06 сентября 2018

пожалуйста, простой код, который же это изображение

Mycode

date = {
onChange: (date, target) => {
  console.log(target)
  this.setState({
    [target]: date
  })
}}

const defaultPropsFilterDate = {
  numberOfMonths: 1,
  showDefaultInputIcon: false,
  navPrev: <img src={Icons['icon-arrow-left.svg']} alt='' className='icon' />,
  navNext: <img src={Icons['icon-arrow-right.svg']} alt='' className='icon' />,
  hideKeyboardShortcutsPanel: true,
  isOutsideRange: () => { }
}

<SingleDatePicker id='birth-date'
                    placeholder='DD/MM/YYYY'
                    displayFormat='DD/MM/YYYY'
                    date={filterBirthDate}
                    onDateChange={date => {
                      this.date.onChange(date, 'filterBirthDate')
                    }}
                    displayFormat="DD/MM/YYYY"
                    dayAriaLabelFormat="DD/MM/YYYY"
                    focused={isFocusBirthDate}
                    onFocusChange={this.date.onFocusStartDate}
                    {...defaultPropsFilterDate}
                  />

это результат этого мой код Я хочу добавить месяц и год. Но я не знаю, как это исправить.

1 Ответ

0 голосов
/ 29 сентября 2018

Вам нужно использовать renderMonthElement prop

<SingleDatePicker
  renderMonthElement={() => <CustomSelect />}
/>

Где ваш CustomSelect - это элемент, который вы хотите отобразить как пользовательский заголовок. Только не забудьте передать события в пользовательский элемент, чтобы изменить дату оттуда.

Вы можете увидеть пример в github airbnb https://github.com/airbnb/react-dates/blob/master/stories/DayPickerSingleDateController.js

Loof для DayPickerSingleDateControllerWrapper.

...