React Datepicker не работает должным образом, если импортирован обработчик событий - PullRequest
0 голосов
/ 15 марта 2019

Я выполнил базовую настройку для пакета react-datepicker, и он работал.Однако в нашем приложении мы также используем пакет events-polyfill.И когда эти два пакета используются одновременно, react-datepicker не работает должным образом.

import React from "react";
import ReactDOM from "react-dom";
import DatePicker from "react-datepicker";
import "events-polyfill";

import "react-datepicker/dist/react-datepicker.css";
import "./styles.css";

function App() {
  return <Example />;
}

// CSS Modules, react-datepicker-cssmodules.css
// import 'react-datepicker/dist/react-datepicker-cssmodules.css';

class Example extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      startDate: new Date()
    };
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(date) {
    this.setState({
      startDate: date
    });
  }

  render() {
    return (
      <DatePicker
        selected={this.state.startDate}
        onChange={this.handleChange}
      />
    );
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Демонстрация: https://codesandbox.io/s/pj3yl7o0wm

Полная ошибка:

Uncaught TypeError: Cannot read property 'once' of null
    at Object.module.exports.EventListenerInterceptor.normalizeListenerOptions (index.js:111)
    at Object.module.exports.EventListenerInterceptor.normalizeListenerArguments (index.js:122)
    at HTMLDocument.target.addEventListener (index.js:161)
    at react-onclickoutside.es.js:226
    at Array.forEach (<anonymous>)
    at onClickOutside._this.enableOnClickOutside (react-onclickoutside.es.js:225)
    at onClickOutside.componentDidMount (react-onclickoutside.es.js:296)
    at commitLifeCycles (react-dom.development.js:14362)
    at commitAllLifeCycles (react-dom.development.js:15463)
    at HTMLUnknownElement.callCallback (react-dom.development.js:100)

И это выделено в файле events-polyfill index.js как виновник:

options.once      = Boolean(options.once);

Совершенно не знаю, в чем проблема.

1 Ответ

1 голос
/ 15 марта 2019

Попробуйте обновить пакет events-polyfill.

Похоже, текущая версия https://github.com/lifaon74/events-polyfill/blob/master/src/EventListenerInterceptor.js#L105 имеет исправление для этого случая.

Вот коммит с исправлением https://github.com/lifaon74/events-polyfill/commit/a087bf90e2335cdad670d08499157c40ea73abdb Он предназначен для 2.1.1, но npm имеет только 2.1.0

npm установка из Git в определенной версии

...