（React Native Gesture Handler）尝试从不同的线程同步调用函数。

Question

我正在尝试从手势状态中改变状态（React Native Gesture Handler）。

const [localShowRecents, setLocalShowRecents] = useState(false)
const translateY = useSharedValue(0);

const gesture = Gesture.Pan()
      .onStart(() => {
        context.value = { y: translateY.value }
      })
      .onUpdate((event) => {
        //console.log(event.translationY);
        translateY.value = event.translationY + context.value.y;
        translateY.value = Math.max(translateY.value, MAX_TRANSLATE_Y)
      })
      .onEnd(() => {
      if (translateY.value > -SCREEN_HEIGHT / 32){
        setLocalShowRecents(true); //change state
      }
}

当我尝试从“.onEnd（）”函数更新状态时，出现错误“尝试从不同的线程同步调用函数”。我该如何正确地从手势处理程序更改状态？

- Ethan Stacey

Answer 1

您的 Reanimated 组件在设备的 UI 线程上运行。其余代码将在设备的 JS 线程上运行。由于您编写的代码尝试在 UI 线程上调用 Javascript 函数，这导致了您看到的错误。

这就是为什么 Reanimated 包括 runOnJS 方法的原因。与其

  setLocalShowRecents(true)

您可以使用

。

  runOnJS(setLocalShowRecents)(true);

请注意修改后的调用方式 - runOnJS(fn)(args)。您可以在Reanimated文档这里了解有关runOnJS的更多信息。

- Abe

Answer 2

这对我有效：npx react-native start --reset-cache，https://github.com/software-mansion/react-native-reanimated/discussions/1571#discussioncomment-3108509

- Dusan Spasojevic