moti: TypeError: Object.values requires that input parameter not be null or undefined
Trying to use MotiView causes the following error…
TypeError: Object.values requires that input parameter not be null or undefined
This error is located at:
in ForwardRef(Moti) (at Splash.tsx:11)
in RCTView (at View.js:34)
in View (at Splash.tsx:10)
in Splash (at SceneView.tsx:126)
in StaticContainer
in StaticContainer (at SceneView.tsx:119)
in EnsureSingleNavigator (at SceneView.tsx:118)
in SceneView (at useDescriptors.tsx:209)
in RCTView (at View.js:34)
in View (at DebugContainer.native.tsx:27)
in DebugContainer (at NativeStackView.native.tsx:71)
in MaybeNestedStack (at NativeStackView.native.tsx:228)
in RNSScreen (at createAnimatedComponent.js:165)
in AnimatedComponent (at createAnimatedComponent.js:215)
in ForwardRef(AnimatedComponentWrapper) (at src/index.native.tsx:147)
in Screen (at NativeStackView.native.tsx:175)
in SceneView (at NativeStackView.native.tsx:276)
in RNSScreenStack (at NativeStackView.native.tsx:267)
in NativeStackViewInner (at NativeStackView.native.tsx:321)
in RNCSafeAreaProvider (at SafeAreaContext.tsx:76)
in SafeAreaProvider (at SafeAreaProviderCompat.tsx:38)
in SafeAreaProviderCompat (at NativeStackView.native.tsx:320)
in NativeStackView (at createNativeStackNavigator.tsx:67)
in NativeStackNavigator (at src/index.tsx:30)
in EnsureSingleNavigator (at BaseNavigationContainer.tsx:429)
in ForwardRef(BaseNavigationContainer) (at NavigationContainer.tsx:132)
in ThemeProvider (at NavigationContainer.tsx:131)
in ForwardRef(NavigationContainerInner) (at src/index.tsx:29)
in _App (created by Connect(_App))
in Connect(_App) (at App.tsx:37)
in RCTView (at View.js:34)
in View (at App.tsx:36)
in Provider (at App.tsx:35)
in Unknown (created by ExpoRoot)
in ExpoRoot (at renderApplication.js:45)
in RCTView (at View.js:34)
in View (at AppContainer.js:106)
in RCTView (at View.js:34)
in View (at AppContainer.js:132)
in AppContainer (at renderApplication.js:39)
What could I be doing wrong?
My code:
import { View, StyleSheet, Dimensions } from 'react-native';
import { View as MotiView } from 'moti';
import { Logo } from 'src/components';
import { colors, padding } from 'src/constants';
export const Splash = () => {
return (
<View style={S.Splash}>
<MotiView from={{ translateX: 200 }} animate={{ translateX: 0 }}>
<Logo style={S.logo} />
</MotiView>
</View>
);
};
const S = StyleSheet.create({
Splash: {
height: '100%',
padding: padding.md,
backgroundColor: colors.white
},
logo: {
position: 'absolute',
top: 0,
left: 0
}
});
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 20 (7 by maintainers)
Ok. I just fixed it. Found a similar issue: https://github.com/software-mansion/react-native-reanimated/issues/1245#issuecomment-694664417 All I needed do was to clear expo cache on start with
expo start --clear
as the reanimated plugin wasn’t picked up (after I added it) in mybabel.config.js
. I’m so happy now. I can now use Moti!😎 Thank you! 🙌🏼Alright. I’ll try reproducing on Snack.