Можете ли вы деконструировать лениво загруженные компоненты React? - PullRequest
Новая
       104

Можете ли вы деконструировать лениво загруженные компоненты React?

0 голосов
/ 10 ноября 2019

Используя импорт es6, вы можете сделать это: 

import { MyComponent } from "../path/to/components.js";

export default function () {
  return <MyComponent/>;
}

Могу ли я сделать это также с React.lazy? 

const { MyComponent } = lazy(() => import("../path/to/components.js"));

Я получаю следующую ошибку, но яне уверен, связано ли это с этой или какой-то другой ошибкой:

Тип элемента недопустим: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получен: undefined

1 Ответ

1 голос
/ 10 ноября 2019

Вы не можете с React.lazy:

React.lazy принимает функцию, которая должна вызывать динамический импорт (). Это должно вернуть Promise, который разрешается в модуль с экспортом по умолчанию, содержащим компонент React. (см. https://reactjs.org/docs/code-splitting.html#reactlazy)

Обходной путь для этого существует: создание промежуточного модуля, который импортирует ваш именованный экспорт и экспортирует его по умолчанию (ср. https://reactjs.org/docs/code-splitting.html#named-exports)

...