Реакция: экспорт провайдера контекста выдает мне ошибку: «Тип элемента недопустим: ожидал строку [...], но получил: undefined»

Question

Резюме

У меня есть файл, в котором я создаю компонент с поставщиком контекста React, который я экспортировал в другой файл (см. Код). Но при импорте это выдает ошибку.

Уже пробовал разные способы импорта файла. Но получите ту же ошибку. Регистрация импортированного поставщика в компоненте показывает, что он существует.

Код

Экспортируемый файл

function PositionContextProvider({ children }) {
  return <EditModeContext.Provder value={false}>{children}</EditModeContext.Provder>;
}

export { PositionContextProvider };

Импорт

import { PositionContextProvider } from './PositionContext';

[...]

function Application() {
  return (
   <ContextQuery query={getPositions}>
    {({ data, loading, fetchMore, isFetchingMore }) => {
      return (
        <PositionContextProvider>
          ...
        </PositionContextProvider /> 
      )
    })}
   </ContextQuery />
  )
}

Ожидается, что он сможет использовать контекст в любом из компонентов в Поставщике, но получит сообщение об ошибке в консоли.

Нарушение инварианта: недопустимый тип элемента: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получено: undefined. Скорее всего, вы забыли экспортировать компонент из файла, в котором он определен, или, возможно, вы перепутали импорт по умолчанию и имена.

Answer 1

Опечатка: отсутствует 'i' в поставщике ..

Answer 2

назначьте вашу функцию переменной, затем экспортируйте ее:

const PositionContextProvider = function({ children }) {
  return <EditModeContext.Provder value={false}>{children}</EditModeContext.Provder>;
}

export { PositionContextProvider };