'TypeError: undefined is not an object (evaluating 'theme.spacing[radius]')

I am using react native elements library to build a UI. I am trying to create a button with an icon. I initially just copied this code from the website without any changes to see if the button works.

import { Button } from "@rneui/themed";

<Button
              title="Basic Button"
              buttonStyle={{
                backgroundColor: 'rgba(78, 116, 289, 1)',
                borderRadius: 3,
              }}
              containerStyle={{
                width: 200,
                marginHorizontal: 50,
                marginVertical: 10,
              }}
 />

I keep getting this error in the app

TypeError: undefined is not an object (evaluating 'theme.spacing[radius]')

which comes from inside Button.js that comes with the ui.library. I am not sure what could be causing this. I managed to use the input component from the library without any issues and from that I would assume I installed it properly. What could be causing this button problem then?

Solution 1:^[1]

why you don't create button with touchOpacity and icon it easier than you use library

Solution 2:^[2]

Import Button module from @rneui/base instead of @rneui/themed

Solution 3:^[3]

I had this issue too. You can solve this issue by wrapping the ThemeProvider component from react-native-elements (@rneui) in the root of your app. For example;

<ThemeProvider theme={myTheme}>
  <Button title="My Button" />
</ThemeProvider>

official migration guide for react-native-elements: https://reactnativeelements.com/docs/migration_guide

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	TNTC
Solution 2
Solution 3	BartK_97

'TypeError: undefined is not an object (evaluating 'theme.spacing[radius]')

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]