编程语言
首页 > 编程语言> > javascript-如何使用Material ui reactjs禁用今天起的过去日期?

javascript-如何使用Material ui reactjs禁用今天起的过去日期?

作者:互联网

我正在使用React Material UI创建日期范围选择器.此功能的逻辑是选择所需日期,如果已选择了所需日期,请禁用所选日期中的所有过去日期.如何实现这个反应材料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;

标签:reactjs,material-ui,html,javascript
来源: https://codeday.me/bug/20191111/2023231.html