添加一个 class 到 react-day-picker？

Question

如何向 react-day-picker 的今天按钮添加 class？

从文档来看似乎是可以的： http://react-day-picker.js.org/api/DayPicker#classNames

const dayPickerClassNames = { todayButton: 'newClass' };

<DayPicker
  classNames={dayPickerClassNames}
/>

但是我得到一个错误：

Warning: Failed prop type: The prop `classNames.day` is marked as required in `DayPicker`, but its value is `undefined`.

Answer 1

我相信它可能只是解析单词 day 并为已解析的 day******* 寻找类名我想我会尝试定义 key:value 关系他们的文档。

// const dayPickerClassNames = { todayButton: 'newClass' };

<DayPicker
  classNames={ todayButton: 'newClass' }
/>

Answer 2

根据 API，它需要以下键（即，它需要容器、包装器、..月..月..日..等键），但您只提供todayButton key/value，显然你需要提供每个 key/value 对。

您应该可以导入默认的 classNames 对象，然后像这样更新 todayButton 值：

import classNames from '../classNames' // this path is probably not correct

const dayPickerClassNames = { ...classNames, todayButton: 'newClass' };

<DayPicker
  classNames={dayPickerClassNames}
/>

Answer 3

const defaultClassNames = DayPicker.defaultProps.classNames,
      newClassNames = { ...datePickerClassNames,
                        container: `${defaultClassNames.container} MY_CONTAINER`
                      };

...

<DayPicker classNames={dayPickerClassNames}/>

我建议在默认 class 后附加您自己的，如上例中的默认 container class 附加 MY_CONTAINER class。

添加一个 class 到 react-day-picker？

Add a class to react-day-picker?

react-day-picker