React Native RNGestureHandlerModule.attach手势处理程序获得3个参数,应为2个

r8uurelv  于 2022-12-19  发布在  React
关注(0)|答案(8)|浏览(269)

我正在建立一个应用程序与React Native,并有一个登录,主页,和成员屏幕。当用户是管理员,我让他去主屏幕,当他是成员,我让他去成员屏幕。并在主屏幕内,我也有AddMember屏幕,所以我建立堆栈导航和抽屉导航堆栈导航内导航到这些屏幕。

import 'react-native-gesture-handler';
import React from 'react';

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { createDrawerNavigator } from '@react-navigation/drawer';

import LoginScreen from './screens/LoginScreen';
import HomeScreen from './screens/HomeScreen';
import MembersScreen from './screens/MembersScreen';
import AddMember from './screens/AddMember';

const Stack = createNativeStackNavigator();
const Drawer = createDrawerNavigator();

function Root() {
return (
<Drawer.Navigator>
  {/* <Drawer.Screen name="Home" component={HomeScreen} /> */}
  <Drawer.Screen name="AddMember" component={AddMember} />
</Drawer.Navigator>
);
}

export default function App() {
return (
<NavigationContainer>
  <Stack.Navigator>
    <Stack.Screen name="Login" component={LoginScreen} />
    <Stack.Screen
      name="Root"
      component={Root}
      options={{ headerShown: false }}
    />
    {/* <Stack.Screen name="Home" component={HomeScreen} /> */}
    <Stack.Screen name="Members" component={MembersScreen} />
   </Stack.Navigator>
   </NavigationContainer>
  );
  }

和登录屏幕

import { useNavigation } from '@react-navigation/core';
import React, { useEffect, useState } from 'react';
import { StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native';

import { 
auth, 
signInWithEmailAndPassword,
onAuthStateChanged,
db,
collection,
getDocs
} from '../firebase';

export default function LoginScreen() {
const [email , setEmail ] = useState('');
const [password , setPassword ] = useState('');

const navigation = useNavigation();

useEffect(() => {
    const unsibscribe = onAuthStateChanged(auth, (user) => {
        if(user) {
            handleCheckAdmin(user.email);
        }
    });

    return unsibscribe;

}, []);

const hanldeLogin = async () => {
    await signInWithEmailAndPassword(auth, email, password)
    .then(userCredentials => {
        const user = userCredentials.user;
    })
    .catch(error => alert(error.message));
}

const handleCheckAdmin = async (userEmail) => {
    try {
        const admins = collection(db, 'admin');
        const adminSnapshot = await getDocs(admins);
        const adminList = adminSnapshot.docs.map(doc => doc.get("adminEmail"));

        adminList.forEach(adEmail => {
        if (adEmail === userEmail) {
            navigation.replace('Root');

        }
        else {
            navigation.replace('Members');
        }
    });

    } catch (error) {
        console.log(error);
    }
}

return (
    <View 
        style={styles.container}
        behavior="padding"
    >
        <View style={styles.inputContainer}>
            <TextInput 
                placeholder="Email"
                value={email}
                onChangeText={ text => setEmail(text)}
                style={styles.input}
            />
            <TextInput 
                placeholder="Password"
                value={password}
                onChangeText={ text => setPassword(text)}
                style={styles.input}
                secureTextEntry
            />
        </View>
        <View style={styles.buttonContainer}>
            <TouchableOpacity
                onPress={hanldeLogin}
                style={styles.button}
            >
                <Text style={styles.buttonText}>Login</Text>
            </TouchableOpacity>
        </View>
    </View>
     )
     }

我的问题是,当我运行应用程序并登录主屏幕时,我得到这个错误:RNGestureHandlerModule.attach手势处理程序获得3个参数,应为2个。

biswetbf

biswetbf1#

我在降级expo SDK时遇到了这个问题。我只是通过运行expo install react-native-gesture-handler解决了这个问题。这样,expo将处理关于您当前SDK的react-native-gesture-handler的最佳版本。希望它能有所帮助!

t2a7ltrp

t2a7ltrp2#

我正在使用expo并安装recat-navigation 6和drawer。所以我已经按照文档进行了操作,我在这里提到一些关键的事情:
1.查看React导航文档来安装所有的东西。安装手势和动画使用博览会安装。
1.添加插件:['React-本机-重新动画/插件']到babel.config.js
1.最后,使用expo start --clear启动项目

t9aqgxwy

t9aqgxwy3#

您安装了什么版本的“react-native-gesture-handler”?如果是v2.0系列,重新安装v1.0系列可能会解决此问题。

rks48beu

rks48beu4#

所以我在尝试使用@rainbow-me/animated-charts时遇到了这个问题。看起来@rainbow-me/animated-charts的最新版本正在安装react-native-gesture-handler: ^1.7.0,但是我们需要react-native-gesture-handler > 2来安装react-native-reanimated v2。我可以通过使用yarn resolutions强制deps使用react-native-gesture-handler > 2来修复这个问题。
我想这不是最好的解决方案,我通常反对使用resolutions,但我没有看到任何其他的选择。
快乐黑客

pvcm50d1

pvcm50d15#

1.重新安装RNGH expo install react-native-gesture-handler(如果您正在使用expo)
1.使用react-native start --reset-cache重置Metro捆绑程序缓存
Github问题

sgtfey8w

sgtfey8w6#

在通过运行yarn add react-native-gesture-handler将我的react-native-gesture-handler^1.9.0更新为^2.1.0后,我也遇到了这个错误。
运行npx pod-install并重新运行应用程序(npx react-native run-ios)修复了该问题。

6mzjoqzu

6mzjoqzu7#

重新启动Metro服务器并清理该高速缓存为我解决了这个问题。只需运行“npx react-native start --reset-cache”

7ivaypg9

7ivaypg98#

如果你正在使用expo,只需输入“expo安装react-native-gesture-handler”和“导入react-native-gesture-handler”,或者在app.tsx中用“GestureHandlerRootView” Package 即可

相关问题