添加自定义 header react-infinite-calendar

Question

如何将自定义 header 组件添加到 react-infinite-calendar？似乎该软件包没有那种支持（虽然不确定）。

有什么方法可以在 header 中插入按钮组件？

预期输出：

基本日历初始化：

https://codesandbox.io/s/floral-fire-npsq7?file=/src/App.js

Answer 1

是的，您可以使用 HeaderComponent 属性将自定义 header 传递给 react-infinite-calendar。您可以在 codesandbox 示例中使用以下代码。

import "./styles.css";
import InfiniteCalendar from 'react-infinite-calendar'
import 'react-infinite-calendar/styles.css' 
export default function App() {
  return (
    <div className="App">
      <InfiniteCalendar
        width={400}
        height={600}
        HeaderComponent={() => <p>123</p>}
      />
    </div>
  );
}

添加自定义 header react-infinite-calendar

Add custom header react-infinite-calendar

javascript

calendar

reactjs