Question

以下是组件：

import React, { Component } from 'react';
import DatePicker from 'react-datepicker';

class DatePickerCreater extends Component {
    constructor(props){
        super(props);
    }

    render() {
        return (
            <DatePicker
                disabled={this.props.answer.isDisabled}
                dateFormat="YYYY/MM/DD"
                selected={Date(this.props.answer.value)}
                onChange={(e) => this.props.blurHandler(e.target.value,this.props.answer)} 
            />
        );
    }
}

export default DatePickerCreater

当我尝试渲染它时，它什么也没显示...

非常感谢每个答案！

Answer 1

selected属性需要一个moment.js日期，而不是简单的javascript日期。您应该得到一个错误，指出“ date.clone不是一个函数 “。您可以使用即时日期来解决此问题：

import moment from 'moment';

class DatePickerCreater extends Component {
    render() {
        return (
            <DatePicker
                disabled={this.props.answer.isDisabled}
                dateFormat="YYYY/MM/DD"
                selected={moment(this.props.answer.value)}
                onChange={(e) => this.props.blurHandler(e.target.value, this.props.answer)}
            />
        )
    }
}

您还可能忘记了导入react-datepicker CSS文件。否则，弹出窗口将无法正确显示：

import 'react-datepicker/dist/react-datepicker.css';

Answer 2

代码还不够，我要告诉super（）需要用props调用什么：

constructor(props){
   super(props);
   // ... code
}

为什么该组件根本不显示？反应DatePicker

2 个答案: