最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - React Error: "React.createElement: type is invalid" when using GluestackUI and Select Component -

programmeradmin1浏览0评论

I am encountering the following error when running my React Native app:

ERROR  Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely fot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ForwardRef`.
    in Unknown (created by RHFInput)
    in FocusScope
    in ActionsheetContentContextProvider
    in RCTView (created by View)
    in View (created by Animated(View))
    in Animated(View)
    in MotionComponent
    in Unknown (created by StyledSelectActionsheetContent)
    in StyledComponent
    in Unknown
    in RCTView (created by View)
    in View (created by Animated(View))
    in Animated(View)
    in Unknown (created by Select.Content)
    in Select.Content
    in RCTView (created by View)
    in View (created by StyledView)
    in StyledComponent
    in RCTView (created by View)
    in View (created by OverlayView)
    in OverlayView (created by OverlayContainer)
    in PortalProvider (created by GluestackUIProvider)
    in StyledProvider (created by GluestackUIStyledProvider)
    in GluestackUIStyledProvider (created by GluestackUIProvider)
    in GluestackUIProvider (created by NativeBaseProvider)
    in NativeBaseProvider (created by App)
    in ToastProvider (created by GluestackUIProvider)
    in PortalProvider (created by GluestackUIProvider)
    in StyledProvider (created by GluestackUIStyledProvider)
    in GluestackUIStyledProvider (created by GluestackUIProvider)
    in GluestackUIProvider (created by App)
    in App (created by RootApp)
    in ReactNativeProfiler (created by RootApp)
    in RCTView (created by View)
    in View (created by __Sentry.TouchEventBoundary)
    in __Sentry.TouchEventBoundary (created by RootApp)
    in RootApp (created by withDevTools(RootApp))
    in withDevTools(RootApp)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent)

I am using the following libraries and versions:

 "@gluestack-style/react": "^1.0.57",
 "@gluestack-ui/config": "^1.1.20",
 "@gluestack-ui/themed": "^1.1.61",
 "@gluestack-ui/themed-native-base": "^0.1.108",
 "react": "18.3.1",
 "react-native": "0.76.2",
 "expo": "^52.0.0",

I suspect the issue might be related to:

Incorrect imports (default vs named imports). GluestackUI configuration or component usage. Here's how I am importing and using the component:

import {
  Select,
} from '@gluestack-ui/themed-native-base';

const App = () => (
  <Select>
     <Select.Item value="1">Option 1</Select.Item>
                <Select.Item value="2">Option 2</Select.Item>
  </Select>
);

I've double-checked my imports, but the error persists.

What I've tried:

Verified the imports for Select and its subcomponents. Checked if any components are undefined. Confirmed that GluestackUI is correctly set up with its provider. Question: What could cause this error in this context, and how can I resolve it? Is there a specific configuration step or component usage pattern I might have missed?

p.s It appear after upgrade expo from 51 to 52 SDK

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论