zoukankan      html  css  js  c++  java
  • antd timePicker组件限制当前之前的时间不可选择

    import React from 'react';
    import ReactDOM from 'react-dom';
    import {Input,DatePicker,Form,Col,Button,Select} from 'antd';
    import 'antd/dist/antd.css';
    import locale from 'antd/lib/date-picker/locale/zh_CN';
    import 'moment/locale/zh-cn';
    import moment from 'moment';
    import ChildrenCom from './children-com.js';
    moment.locale('zh-cn');
    const { RangePicker,TimePicker  } = DatePicker;
    const { Option } = Select;
    
    class FormItem extends React.Component{
    	constructor(props){
    		super(props);
    		this.state={
    			count:1,
    			time:'',
    			startTime:new Date(+new Date() +8*3600*1000).toISOString().split("T")[1].split(".")[0]//获取当前时间
    		};
    		 this.myRef = React.createRef();
    		
    	}
    	
    	timeChange = (time,timeString)=>{
    		this.setState({
    			time:timeString
    		})
    	};
          //限制小时显示 disabledHours = ()=>{ let hours=[]; let time = this.state.startTime; // let time=new Date(+new Date() +8*3600*1000).toISOString().split("T")[1].split(".")[0]; // this.setState({startTime:time},()=>{console.log("11")}); let timeArr = time.split(":"); for(var i=0;i<parseInt(timeArr[0]);i++){ hours.push(i) } return hours; };
        //限制分钟 disabledMinutes = (selectedHour)=>{ let {startTime} = this.state; let timeArr =startTime.split(":"); let minutes =[]; if(selectedHour == parseInt(timeArr[0])){ for(let i=0;i<parseInt(timeArr[1]);i++){ minutes.push(i); } } return minutes; };
    //限制秒 disabledSeconds = (selectedHour,selectedMinute)=>{ let {startTime} = this.state; let timeArr = startTime.split(':'); let second = []; if (selectedHour == parseInt(timeArr[0]) && selectedMinute == parseInt(timeArr[1])) { for(var i = 0; i <= parseInt(timeArr[2]); i++) { second.push(i) } } return second; }; render(){ return( <div> <TimePicker disabledHours = {this.disabledHours} disabledMinutes = {this.disabledMinutes} disabledSeconds = {this.disabledSeconds} value={ this.state.time ? moment(this.state.time,"HH:mm:ss"):moment() } onchange={this.timeChange} format="HH:mm:ss" /> </div> ) } } export default FormItem;

      

    实现效果图如下

  • 相关阅读:
    利用模板实现c++智能指针
    movit 相关函数(二)
    moveit相关函数解释
    ros常用函数(1)
    Qtcreator中cin函数无法在application output中进行输入的问题的解决
    c++速成,适合有c基础的朋友(3)
    【重要通知】本博客不再更新,更多教程请访问 makermaker.cc
    BBC micro:bit 学习资源汇总(最近更新2019年1月6日....)
    [20个项目学会BBC micro:bit编程] 20-无线通信
    [20个项目学会BBC micro:bit编程] 19-直流电机控制
  • 原文地址:https://www.cnblogs.com/changyuqing/p/13748738.html
Copyright © 2011-2022 走看看