尝试从不同的线程同步调用匿名函数。带抽屉导航器

Question

我刚刚升级到 React Native 0.67.3，现在当我打开使用 React Navigation v6 的应用程序时，我收到此错误：

Occurred in worklet location: /Users/path/node_modules/react-native-reanimated/lib/reanimated2/hook/useAnimatedStyle.js (332:24)

Possible solutions are:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
2022-03-09 10:54:14.180294-0500 project[1949:15686] [native] Tried to synchronously call anonymous function from a different thread.

Occurred in worklet location: /Users/path/node_modules/react-native-reanimated/lib/reanimated2/hook/useAnimatedStyle.js (332:24)

我目前正在使用 DrawerNavigator，如下所示：

         <Drawer.Navigator initialRouteName="Home" >
            <Drawer.Screen name="HomeStack" component={HomeStack} />
          </Drawer.Navigator>

以下是我的相关软件包的版本：

    "react-native-reanimated": "2.3.1",
    "react-navigation": "^4.4.4",
    "react-navigation-stack": "^2.3.11",
    "react-native-gesture-handler": "^1.9.0"

有什么想法 DrawerNavigator 可能导致此问题以及如何解决吗？

Answer 1

React Navigation Drawer Navigator V6 使用react-native-reanimatedV2，它采用特殊的工作集函数来同步运行 JavaScript 和 UI 线程的代码。

react-native-reanimated尝试通过设置useLegacyImplementation 回退到旧的V1true

 <Drawer.Navigator useLegacyImplementation={true} initialRouteName="Home" >
     <Drawer.Screen name="HomeStack" component={HomeStack} />
 </Drawer.Navigator>