Как значение игнорируется, если оно выбрано на response-Datetimepicker

Question

Когда я справляюсь с изменением и даже до того, как ручку отправлю. Я получаю ошибку со значением undefined, когда я изменяю его, я получаю, что handlechange не определен.

Я попытался определить смену рукоятки несколькими различными способами, и я покажу два способа, которыми я, казалось, двигался вперед. Но все равно получаю ошибки.

это привело меня к значению, которое не определено

 handleSubmit = event => {
    event.preventDefault();
    this.setState({wasSubmitted: true});
}

handleChange = e => {
    e.preventDefault();
    this.setState({ value: e.target.value });
}


render() {
    const { value, wasSubmitted } = this.state;

    if (wasSubmitted) {
        return <Bookingpage><Redirect value={this.state.value} to='./Bookingpage/Bookingpage' /></Bookingpage>
    } else {

Это дескриптор ChangeChange не определен и это весь сценарий

import React from "react";
import Bookingpage from "./Bookingpage/Bookingpage";
import "./Datepicker.css";
import "./Btnsearch/Btnsearch";
// react plugin used to create datetimepicker
import ReactDatetime from "react-datetime";
import { Redirect } from 'react-router-dom';

// reactstrap components
import {
  FormGroup,
  InputGroupAddon,
  InputGroupText,
  InputGroup,
  Col,
  Row
} from "reactstrap";
import Btnsearch from "./Btnsearch/Btnsearch";
class Datepicker extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ""
    };

    this.handleChange = handleChange;
    this.handleSubmit = handleSubmit;

  }


  handleSubmit = e => {
    event.preventDefault();
    this.setState({wasSubmitted: true});
}

handleChange = e => {
    event.preventDefault();
    this.setState({ value: e.target.value });
}

render() {
    const { value, wasSubmitted } = this.state;

    if (wasSubmitted) {
        return <Bookingpage><Redirect value={this.state.value} to='./Bookingpage/Bookingpage' /></Bookingpage>
    } else {
      return (
        <>
          <FormGroup>
            <InputGroup className="input-group-alternative">
              <InputGroupAddon addonType="prepend">
                <InputGroupText
                >
                  <i className="ni ni-calendar-grid-58" />
                </InputGroupText>
              </InputGroupAddon>
              <ReactDatetime
              value={this.state.value}
              onChange={this.handleChange}
              inputProps={{
                placeholder: "Date Picker Here"
              }}
              timeFormat={false}
              />
            </InputGroup>
          </FormGroup>
          <form onSubmit={this.handleSubmit}>
          <Btnsearch  type="submit" value={this.state.value}/>
          </form>
        </>
      );
    }
  }
}

export default Datepicker;

Я ожидал перенести значение prop на <Bookingpage />

Answer 1

В первом случае вы должны иметь предустановку babel для такой привязки. https://babeljs.io/docs/en/babel-plugin-proposal-class-properties

Во втором синтаксис привязки в конструкторе неверен. Должно быть this.handleChange = this.handleChange.bind(this);