Блог

Главная - Вопросы по программированию - Как я могу использовать компонент даты в форме реакции

Как я могу использовать компонент даты в форме реакции

#javascript #reactjs #react-component

#javascript #reactjs #реагирующий компонент

Вопрос:

Я создал форму, и в ней есть поле выбора даты. Я хочу использовать компонент выбора даты, но не могу понять, как заставить его работать. Я использую cdn вместо npm и не уверен, что упускаю что-то важное.

 class Request extends React.Component{
  constructor(){
    super()
    this.state = {
      location:'',
      date: ''
    }
    this.handleLocation = this.handleLocation.bind(this)
  }
  handleDateSelect(e){
     this.setState({
      date: e.target.value
    })   
  }
  handleLocation(e){
    this.setState({
      location: e.target.value
    })
  }
  handleDateChange(e){
    this.setState({
      date: e.target.value
    })
  }
  render(){
    return(
      <div>
          Today's Date:  <DatePicker selected={this.state.date} onSelect={this.handleDateSelect} onChange={this.handleDateChange} /><br />
          Location: <input type="text" name="location" onChange={this.handleLocation} value={this.state.location} />
        {this.state.location}
      </div>
    )    
  }
}

Ошибка, которую я получаю, — это неперехваченная ошибка ReferenceError: useState не определено
Вот ручка для большего контекста

Комментарии:

1. В вашей изолированной среде у вас есть const [startDate, setStartDate] = useState(new Date()); информация о том, что вы получаете сообщение об ошибке. вы используете старый способ определения состояния, и вы использовали useState и не импортировали из React?

2. Могу ли я использовать cdn для получения useState ?

Ответ №1:

Вы импортировали useState?

 import React, { useState } from 'react';

Комментарии:

1. Для справки, ваш класс запроса использует перехватчик useState . Итак, я думаю, что ошибка не связана с DatePicker, и вы просто забыли импортировать перехват в файл, содержащий класс запроса.

2. что делать, если я просто добавил startDate и setStartDate в состояние? будет ли это работать?

3. Да, хук useState предназначен только для функциональных компонентов, а не для компонентов класса. Однако setStartDate — это функция, которую вы определили для обновления этой части состояния (startdate). Поэтому нет необходимости добавлять это, чтобы добавить это в состояние.

4. Извините, я в замешательстве. Я несколько новичок в react. Ошибочна ли моя настройка codepen? Если я создаю setStartDate функцию, как мне ее вызвать? codepen.io/isogunro/pen/OJNeLwY?editors=0011

5. codesandbox.io/s/compassionate-benz-rho9y?file=/src/App.js Вот рабочий пример DatePicker, основанный на вашем коде. Я надеюсь, что это поможет