当前位置: 代码迷 >> 综合 >> react-native设置路由以及Attempt to invoke interface method boolean com.swmansion.reanimated.layoutReanim报错
  详细解决方案

react-native设置路由以及Attempt to invoke interface method boolean com.swmansion.reanimated.layoutReanim报错

热度:50   发布时间:2023-11-26 08:49:47.0

        在目前最新rn版本v0.67.2下,在设置react-navigation时,可以直接安装以下依赖:

yarn add react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view @react-navigation/material-top-tabs react-native-tab-view @react-navigation/bottom-tabs @react-navigation/stack @react-navigation/native

        在项目入口文件App.js中:

//项目入口文件
//2021/9/20
//created by GM
import React from 'react';
import Nav from './src/Nav';export default function App() {return <Nav></Nav>;
}

        然后在自创建文件夹src下的Nav.js中设置路由:

//页面路由
//2021/9/20
//created by GM
import React from 'react';
import MainPage from './pages/MainPage';
import PingPage from './pages/PingPage';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';const Stack = createStackNavigator();export default function Nav() {return (<NavigationContainer><Stack.Navigator><Stack.Screen name="MainPage" component={MainPage} /><Stack.Screen name="PingPage" component={PingPage} /></Stack.Navigator></NavigationContainer>);
}

        但是在最新版本中会出现这种报错:

Attempt to invoke interface method boolean com.swmansion.reanimated.layoutReanimation.NativeMethodsHolder.isLayoutAnimationEnabled() on a null object reference

        这种时候,只需要在MainApplication中添加:

import com.facebook.react.bridge.JSIModulePackage; // <- 添加
import com.swmansion.reanimated.ReanimatedJSIModulePackage; // <- 添加

        然后在

    @Overrideprotected String getJSMainModuleName() {return "index";}

        之后,添加代码:

    @Overrideprotected JSIModulePackage getJSIModulePackage() {return new ReanimatedJSIModulePackage();}

        这时候再run就可以正常使用路由了。。。

  相关解决方案