如何使用 Material ui Reactjs 禁用今天日期中的过去日期?

2024-03-18

我正在使用 React Material ui 创建日期范围选择器。我此功能背后的逻辑是选择所需日期,如果已选择所需日期,则禁用所选日期中的所有过去日期。如何实现这个react材质ui?

这是我的代码,

import React from 'react';
import {render} from 'react-dom';
import DatePicker from 'material-ui/DatePicker';

function disablePrevDates(date) {
  return date.getDay() === 0;
}

class App extends React.Component {
    render() {
        return (
            <div>
                <DatePicker hintText="Check-in" shouldDisableDate={disablePrevDates} />
            </div>
        )
    }
}

export default App;

这里是:

import React from 'react';
import DatePicker from 'material-ui/DatePicker';

function disablePrevDates(startDate) {
  const startSeconds = Date.parse(startDate);
  return (date) => {
    return Date.parse(date) < startSeconds;
  }
}

class App extends React.Component {
    
    render() {
        const startDate = new Date();
//      or:
//      const startDate = new Date('December 20, 2016');
//      const startDate = this.state.firstDate;
      
        return (
            <div>
                <DatePicker 
                  hintText="Check-in" 
                  shouldDisableDate={disablePrevDates(startDate)}
                />
            </div>
        )
    }
}

export default App;
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 Material ui Reactjs 禁用今天日期中的过去日期? 的相关文章

  • 递归链接 Promise

    我正在开发一个简单的 Windows 8 应用程序 我需要在其中从网站获取一组数据 我正在使用 WinJS xhr 来检索此数据 它返回一个 Promise 然后 我将回调传递到此 Promise 的 then 方法中 该方法为我的回调提供
  • 如何将多个文件上传到Firebase?

    有没有办法将多个文件上传到 Firebase 存储 它可以在一次尝试内上传单个文件 如下所示 fileButton addEventListener change function e Get file var file e target
  • Java:从 ScriptEngine javascript 返回一个对象

    我正在尝试使用 Java 来评估 javascript脚本引擎 https docs oracle com javase 7 docs api javax script ScriptEngine html班级 这是我正在尝试做的事情的一个简
  • Firefox CSS 旋转与 Chrome 旋转不同

    我想制作一个 3D 矩形 平行六面体 用户可以用箭头移动它 它在 Chrome 中工作得很好 但在 Firefox 中 一些转换 实际上很多 与 Chrome 不同 看着this https jsfiddle net 7273yur9 2
  • 可点击的进度条

    我正在使用 Angular 并在 JavaScript 的帮助下开发了一个可点击的进度条 这是我能做到的最好的 有没有办法将滑块放置在进度条内但不干扰进度可视化 堆栈闪电战 https stackblitz com edit angular
  • 单击文件下载后,成功后使用 AJAX 重定向到另一个页面

    In my WordPress project my Download button containing a zip file which onClick should be downloaded So the HTML producin
  • 从数据库中给定时间起经过的时间

    我有一个 HTML 表 其中包含从数据库中提取的记录 我正在使用 PHP MySQL 我的表中名为 Timer 的列未从数据库中检索 我需要在此处显示经过的时间 从数据库中的特定时间开始 例如 假设现在的时间是2013年2月21日下午6点2
  • JQuery 验证不起作用

    我有一种表单 其中一个输入类型的值为 名字 但这可以在 onfocus 函数上更改我想验证此输入字段 如果它为空白或 名字 我有两个 jQuery 文件jquery 1 4 2 min js jquery validate pack js
  • 如何在 Web 应用程序中使用 Javascript 安全地访问 Windows Azure 移动服务?

    我需要一本 web javascript 安全入门书 根据如何使用 Windows Azure 移动服务的 HTML JavaScript 客户端 http www windowsazure com en us develop mobile
  • Array.indexOf 如何比 Array.some 更高效

    这个问题的灵感来自于这个问题的竞争答案 具有多个参数的indexOf https stackoverflow com questions 39000151 indexof with multiple arguments 用户想知道一种有效的
  • 将命令行参数传递给 emscripten 生成的应用程序

    当使用 Emscripten 编译 C 程序时 会生成一个 HTML 页面来显示程序的结果 我想知道如何将命令行参数传递给应用程序 例如 对于原始的 C 程序 它是 bfs 32 1 我能够通过向生成的 html 文件添加一行来传递命令行参
  • 使用 sockjs 和 stomp 进行 /info 请求期间没有 cookie

    我正在尝试将 Spring Security 与 websockets 一起使用 作为一个例子 我正在使用 spring websocket chat https github com salmar spring websocket cha
  • 使用 Lodash 循环 JavaScript 对象中的属性

    是否可以循环访问 JavaScript 对象中的属性 例如 我有一个 JavaScript 对象定义如下 myObject options property1 value 1 property2 value 2 属性将动态添加到该对象 有没
  • 谷歌浏览器不显示一个网站的alert()弹出窗口

    我正在开发一个 javascript 循环 该循环会随着循环的进行而提醒每个键值 为了加快速度 我选中了 阻止此页面创建其他对话框 框 通常这只会抑制一个例程的弹出窗口 但它们还没有回来 在 Google Chrome 中 alert 消息
  • 为缺少字体的 Web 浏览器降低 Unicode 字符的质量

    我在 html 文档中使用 Unicode 检查标记 U 2713 我发现它在大多数浏览器中都可以正常显示 但偶尔我会遇到有人的电脑上缺少字体 如果字体丢失 是否有 HTML JS 技巧来指定替代显示字符 或图像 没有直接的方法可以判断任何
  • 为什么对于大于 65776 像素的画布源,drawImage 性能差异很大

    我在 jsperf 上写了一些与以下相关的测试用例 1 在屏幕外画布上绘图 2 将图像绘制到屏幕画布上 我发现如果源画布中的像素数 无论 dst 小于 65776 像素 性能会高得多 我预计这个性能限制是 65536 像素 如果有的话 He
  • 您最喜欢的 JS/CSS 下拉菜单是什么? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 希望在网站上实现一个 只是好奇其他人都使用过什么以及他们有过什么样的体验 EDIT我也不是一个超级粉丝
  • 如何设置 .eslintrc 来识别“require”?

    我是新来的ESLint http eslint org 并且我已经成功地将 ESLint 与IntelliJ https www jetbrains com idea 开箱即用 我的 ESLint 集成无法识别node 但对文档的基本审查表
  • 音频html标签无法快进或快退控制

    我正在使用音频 html 标签从我的上传服务器加载音频 但我不知道为什么我的音频无法像往常一样循环 快进或快退控制 我的音频 标题 Accenpt Ranges bytes Connection Keep Alive Content Len
  • nodeJS exec 不适用于“cd”shell cmd

    var sys require sys exec require child process exec exec cd home ubuntu distro function err stdout stderr console log cd

随机推荐