Не можете импортировать функцию в мой компонент в React? - PullRequest
Новая
       1

Не можете импортировать функцию в мой компонент в React?

0 голосов
/ 23 октября 2019 
const getWidthFactory = isMobileFromSSR => () => {
 const isSSR = typeof window === "undefined";
 const ssrValue = isMobileFromSSR
  ? Responsive.onlyMobile.maxWidth
  : Responsive.onlyTablet.minWidth;

 return isSSR ? ssrValue : window.innerWidth;
};

const ProfilePage = ({ isLoggedIn, logOutUser, isMobileFromSSR }) => (
 <>
  <Layout GenericHeadingComponent={HomepageHeading}
   isLoggedIn={isLoggedIn}
   logOutUser={logOutUser}
   getWidth={getWidthFactory(isMobileFromSSR)}
  >
   /* other stuff */
  </Layout>
 </>
)

Кажется, это работает, когда объявленная функция находится в файле компонента, а не когда я ее импортирую?

Вот как я настроил функцию в своем собственном файле для экспорта:

utils/utils.js

import {
 Responsive,
} from 'semantic-ui-react'


export function getWidthFactory(isMobileFromSSR) {
 return function () {
  var isSSR = typeof window === "undefined";
  var ssrValue = isMobileFromSSR ? Responsive.onlyMobile.maxWidth : Responsive.onlyTablet.minWidth;
  return isSSR ? ssrValue : window.innerWidth;
 };
};

Я думаю, что меня сбивает с толку то, что в версии, где функция существует в файле, кажется, используется параметр isMobileFromSSR

Так как бы вы переписали это так, чтобы оно работало как экспортированная функция с параметром?

ОБНОВЛЕНИЕ

Я импортирую это так или пытался ... 

 import { getWidthFactory } from  '../../util/util'

1 Ответ

0 голосов
/ 23 октября 2019

Всегда начинайте имена компонентов с заглавной буквы . React рассматривает компоненты, начинающиеся со строчных букв, как теги DOM.

В вашем случае getWidthFactory должно быть похоже на GetWidthFactory

...