Почему я получаю эту ошибку: Ошибка попытки импорта: DatePickerField не экспортируется из /..wither

Question

Я пытаюсь реализовать поля Formik в своей форме material-ui. У меня все работает, кроме даты. Какой кошмар. У меня было много проблем, но в настоящее время React сообщает мне:

Ошибка при попытке импорта: DatePickerField не экспортируется из '../formfields'

Вот файл DatePickerField.jsx полностью:

import React, { useState, useEffect } from 'react';
import { useField } from 'formik';
import Grid from '@material-ui/core/Grid';
import DateFnsUtils from '@date-io/date-fns';
import {
  MuiPickersUtilsProvider,
  KeyboardDatePicker
} from '@material-ui/pickers';

const DatePickerField = props => {
  const [field, meta, helper] = useField(props);
  const { touched, error } = meta;
  const { setValue } = helper;
  const isError = touched && error && true;
  const { value } = field;
  const [selectedDate, setSelectedDate] = useState(null);

  useEffect(() => {
    if (value) {
      const date = new Date(value);
      setSelectedDate(date);
    }
  }, [value]);

  function _onChange(date) {
    if (date) {
      setSelectedDate(date);
      try {
        const ISODateString = date.toISOString();
        setValue(ISODateString);
      } catch (error) {
        setValue(date);
      }
    } else {
      setValue(date);
    }
  }

  return (
    <Grid container>
      <MuiPickersUtilsProvider utils={DateFnsUtils}>
        <KeyboardDatePicker
          {...field}
          {...props}
          variant="inline"
          format="MM/dd/yyyy"
          value={selectedDate}
          onChange={_onChange}
          error={isError}
          invalidDateMessage={isError && error}
          helperText={isError && error}
          disableToolbar
          KeyboardButtonProps={{
            'aria-label': 'change date',
          }}
        />
      </MuiPickersUtilsProvider>
    </Grid>
  );
}

export default DatePickerField;

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

import { DatePickerField } from '../../forms/formfields';

И:

import DatePickerField from '../../forms/formfields';

Но в любом случае я получаю ошибку. Что я делаю не так? Любая помощь очень ценится!

Answer 1

Вы не импортируете файл. вы указали путь, но не добавили нужный файл из папки formfields .. Поэтому добавьте / DatePickerField к пути импорта