reactjs - 只需要在范围选择器选择区域 antd 中显示一个月

标签 reactjs typescript antd daterangepicker

我正在使用 Ant 金服日历范围选择器 对于我的 react 应用程序。我只想在选择时显示一个月的日历下拉列表,而不是默认的两个月。

<div className="DatePickerBar">
   <RangePicker format="YYYY-MM-DD"
     className="DateInput"
     value={[moment(dateRange.from), moment(dateRange.to)]}
     onChange={this.onRangeChange}
     allowClear={false}
    />
</div>

最佳答案

对于 antd@4,可以使用此 CSS

.ant-picker-panels > *:first-child button.ant-picker-header-next-btn {
  visibility: visible !important;
}

.ant-picker-panels > *:first-child button.ant-picker-header-super-next-btn {
  visibility: visible !important;
}

.ant-picker-panels > *:last-child {
  display: none !important;
}

.ant-picker-panel-container, .ant-picker-footer {
  width: 280px !important;
}

.ant-picker-footer-extra > div {
  flex-wrap: wrap !important; 
}

关于reactjs - 只需要在范围选择器选择区域 antd 中显示一个月,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61185218/

相关文章:

javascript - 如何在 react.js 中导入和使用 D3-tube-map

reactjs - UseApolloClient 查询不会返回 fetchMore

sql-server - 如何使用 sequelize 在 where 对象中指定外部模型上的列?

reactjs - 如何在 Antd Input 上使用 React-Hook-Form?

javascript - "browser-external:events"中没有与导入 "EventEmitter"匹配的导出

typescript 和 babel-plugin-module-resolver : VS Code doesn't resolve imports

angular - 无法在 Angular 中自定义 PrimeNG Quill Editor

javascript - antd水平子菜单 "floating"

javascript - 将 Redux 与 ant design 表单结合使用的最佳解决方案

reactjs - 如何在 React JS 中读取组件内的 URL 参数?