无法读取未定义的属性'create' - react-date错误

时间:2017-11-15 10:33:02

标签: javascript reactjs jsx react-dates

从'react-dates'库中添加SingleDatePicker时,我收到此错误。尝试了一切,但找不到错误。代码只是显示日历并显示用户选择的日期。请帮忙! 这是代码:

import React from 'react';
import moment from 'moment';
import { SingleDatePicker } from 'react-dates';
import 'react-dates/lib/css/_datepicker.css';

export default class ExpenseForm extends React.Component {
  state = {
    createdAt: moment(),
    calenderFocused: false
  };
  onDateChange = (createdAt) => {
    this.setState(() => ({ createdAt }));
  };

  onFocusChange = ({ focused }) => {
    this.setState(() => ({ calenderFocused: focused }));
  };

  render() {
    return (
      <div>
        <form>
          <SingleDatePicker
            date={this.state.createdAt}
            onDateChange={this.onDateChange}
            focused={this.state.calendcalenderFocused}
            onFocusChange={this.onFocusChange}
          />
        </form>
      </div>
    );
  }
};

我在chrome-dev-tool中遇到的错误:

Uncaught TypeError: Cannot read property 'create' of undefined
    at Object.createLTR [as create] (ThemedStyleSheet.js?17e6:46)
    at WithStyles.maybeCreateStyles (withStyles.js?55c9:121)
    at WithStyles.componentWillMount (withStyles.js?55c9:107)
    at callComponentWillMount (react-dom.development.js?cada:6337)
    at mountClassInstance (react-dom.development.js?cada:6393)
    at updateClassComponent (react-dom.development.js?cada:7849)
    at beginWork (react-dom.development.js?cada:8233)
    at performUnitOfWork (react-dom.development.js?cada:10215)
    at workLoop (react-dom.development.js?cada:10279)
    at HTMLUnknownElement.callCallback (react-dom.development.js?cada:540)
The above error occurred in the <withStyles(SingleDatePicker)> component:
    in withStyles(SingleDatePicker) (created by ExpenseForm)
    in form (created by ExpenseForm)
    in div (created by ExpenseForm)
    in ExpenseForm (created by AddExpensePage)
    in div (created by AddExpensePage)
    in AddExpensePage (created by Route)
    in Route (created by AppRouter)
    in Switch (created by AppRouter)
    in div (created by AppRouter)
    in Router (created by BrowserRouter)
    in BrowserRouter (created by AppRouter)
    in AppRouter
    in Provider

3 个答案:

答案 0 :(得分:8)

我在测试中遇到了同样的错误,并添加import 'react-dates/initialize';修复了它。

请参阅https://github.com/airbnb/react-dates#initialize

答案 1 :(得分:1)

导入&#39; react-dates / initialize&#39;;

从反应日期的v13.0.0开始,这个项目依赖于反应风格。如果您想继续使用CSS样式表和类,需要进行一些额外的设置才能完成任务。因此,您需要导入react-dates / initialize以在我们的组件上设置类名。

参考:https://github.com/airbnb/react-dates

答案 2 :(得分:-3)

您没有正确启动状态。您应该使用构造函数,如下所示:

    {% for field in form.visible_fields %}
        {{ field.label_tag }}
        {{ field }}
    {% endfor %}