删除警告：[react-native-gesture-handler]看起来您使用的是带有手势组件的旧API，请查看新的手势系统

laawzig2  于 2022-12-30  发布在  React
关注(0)|答案(2)|浏览(247)

我正在创建一个项目来学习React Native。我在这个项目上使用了typescript。我添加了react-navigation：为了让React导航发挥作用，我必须做到：

yarn add @react-navigation/native
yarn add @react-navigation/stack
yarn add react-native-screens react-native-safe-area-context
yarn add react-native-reanimated react-native-gesture-handler

不幸的是，我有这个警告对我的Yarn开始：

WARN  RCTBridge required dispatch_sync to load RNGestureHandlerModule. This may lead to deadlocks
 LOG  Running "TddReactNative" with {"rootTag":11,"initialProps":{}}
 WARN  [react-native-gesture-handler] Seems like you're using an old API with gesture components, check out new Gestures system! 
PanGestureHandler@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:137194:38
PanGestureHandler@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:136501:34
RCTView
View
AnimatedComponent@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:68816:38
AnimatedComponentWrapper
RCTView
View
Card@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:135767:36
CardContainer@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:135324:34
RNSScreen
AnimatedComponent@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:68816:38
AnimatedComponentWrapper
MaybeFreeze@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:161553:23
Screen@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:161620:36
MaybeScreen@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:161373:24
RNSScreenContainer
ScreenContainer@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:161753:31
MaybeScreenContainer@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:161344:23
RCTView
View
Background@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:123808:21
CardStack@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:133002:36
RNCSafeAreaProvider
SafeAreaProvider@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:131859:24
SafeAreaProviderCompat@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:132694:24
RCTView
View
GestureHandlerRootView
StackView@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:122717:36
StackNavigator@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:122563:32
EnsureSingleNavigator@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:124954:24
BaseNavigationContainer@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:124463:28
ThemeProvider@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:130618:21
NavigationContainerInner@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:130478:26
AppNavigator
RCTView
View
RCTView
View
AppContainer@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:76309:36
TddReactNative(RootComponent)@http://192.168.3.2:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=org.reactjs.native.example.TddReactNative:83059:28

我试图删除豆荚和重新安装他们与：

cd ios
rm -rf Pods/
pod install

之后，我重新推出了yarn start和XCode应用程序。
下面是我的React导航和其他依赖关系的版本：

"dependencies": {
    "@react-navigation/native": "^6.0.6",
    "@react-navigation/stack": "^6.0.11",
    "@types/styled-components": "^5.1.20",
    "moment": "^2.29.1",
    "react": "17.0.2",
    "react-native": "0.66.4",
    "react-native-gesture-handler": "^2.2.0",
    "react-native-get-location": "^2.2.1",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-reanimated": "^2.3.1",
    "react-native-safe-area-context": "^3.3.2",
    "react-native-screens": "^3.10.2",
    "styled-components": "^5.3.3"
  },

我正在Iphone13上测试这款应用，这只是一个警告，但有人知道为什么会出现这个警告，以及如何删除它吗？

react-native

2条答案

按热度按时间
egmofgnx

egmofgnx1#

新版本的react-native-gesture-handler会在您使用旧API版本时发出警告，但如果您的某个包/库使用它，也会发出警告。
要禁用警告，可以忽略日志。
在您的app. js/ app.tsx中

import { LogBox } from 'react-native';

LogBox.ignoreLogs([
  "[react-native-gesture-handler] Seems like you\'re using an old API with gesture components, check out new Gestures system!",
]);

GitHub thread about this topic

更新

此问题已修复，因为：第一个月

赞(0）分享  回复(0）举报  2022-12-30
yqkkidmi

yqkkidmi2#

Use yarn add @react-navigation/native-stack -> {createNativeStackNavigator()}

使用@react-navigation/native-stack包代替@react-navigation/stack用于导航器和屏幕
仅当您需要导航功能时才应用此功能@react-navigation/stack允许您使用JavaScript实现自定义过渡，但如果您不太了解屏幕过渡，@react-navigation/native-stack对于导航和屏幕来说就足够了

赞(0）分享  回复(0）举报  2022-12-30
我来回答

相关问题

    查看更多

    热门标签

    更多
    JavaquerypythonNode开发语言requestUtil数据库Table后端算法LoggerMessageElementParser

    最新问答

    更多
    • 蜀ICP备2022004421号-2 NULL123 https://www.null123.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com