首页 > 解决方案 > TypeError:signUp 不是函数 - React Native Redux Typo

问题描述

我正在尝试学习有关 redux 的基础知识,并且正在学习 Udemy 课程。我遇到了与以下帖子相同的问题,但我已经多次查看我的代码并且没有看到任何语法错误。我希望有人能指出我在哪里发现了代码。

注册无效,注册未定义错误 React Native

注册不是一个功能。(在注册({用户名:用户名,密码:密码})','注册'未定义);

import React, {useState, useContext} from 'react';
import {StyleSheet, View, TextInput, Button, TouchableOpacity, Text } from 'react-native'
import config from '../config';
import {Context as AuthContext} from '../context/AuthContext';

const LoginForm = ({navigation}) => {
    const { state, signup } = useContext(AuthContext);
    const [userName, setUserName] = useState('');
    const [password, setPassword] = useState('');
    const [error, setError] = useState('');
    const [loggedIn, setLoggedIn] = useState(false);

    loginSuccess = () => {
        setLoggedIn(true);
        navigation.navigate('mainFlow');
    };

    loginFailed = () => {
        setError('Login failure. Please try again.');
    };


    return (
    <View style = {styles.container}>
        <TextInput placeholder = "username or email"
            placeholderTextColor= "rgba(255, 255, 255, 0.7)"
            returnKeyType="next"
            keyboardType="email-address"
            autoCapitalize="none"
            autoCorrect={false}
            value={userName}
            onChangeText={setUserName}
            style ={styles.input}/>
        <TextInput placeholder = "password"
            placeholderTextColor= "rgba(255, 255, 255, 0.7)"
            returnKeyType="go"
            secureTextEntry
            value={password}
            onChangeText= {setPassword}
            style = {styles.input}/>
        <TouchableOpacity style = {styles.buttonContainer} onPress={()=> signup({userName, password})}>
            <Text style={styles.buttonText}> 
                LOGIN 
            </Text>
        </TouchableOpacity>
    </View>
    );
};

const styles = StyleSheet.create({
    container: {
        padding: 20
    },
    input: {
        height: 40, 
        backgroundColor: 'rgba(255, 255, 255, 0.2)',
        marginBottom: 15, 
        color: '#FFF',
        paddingHorizontal: 10
    },
    buttonContainer: {
        backgroundColor: '#2980b9',
        paddingVertical: 15
    },
    buttonText: {
        textAlign: 'center',
        color: '#FFFFFF',
        fontWeight: '700'
    },
    error : {
        fontSize: 20,
        color: 'red',
        fontFamily: 'Baskerville'
    }
});
export default LoginForm;

注意:我认为这是一个错字,因为我的代码与教程和上面链接的问题相同(除了她的错字。

授权上下文。Node.js 注意:config 是我对 Firebase 的身份验证文件。我试图删除所有内容,signup只删除console.log,但我无法进入该功能。

import CreateDataContext from './CreateDataContext';
import config from '../config';

const authReducer = (state, action) => {
    switch(action.type){
        default: 
            console.log('switch values: ' + state);
            return state;
    };
};

const signup = (dispatch) => {
    return async ({userName, password})=>{
    try{
        // make an api request to sign up with email and password
        const user = {
            userName: userName,
            password: password,
        };

        const response = config.loginViaRedux(user);
        // if sign up was successful , we want to modify our state telling it the user was authenticated
        console.log('response: ' + response.data);
    } catch(e){
        // if sign up fails, we need to show an error message
        console.log('response error: ' + e.message);
    }
    };
};

const signIn = (dispatch) => {
    return({email, password})=>{
    };
};

const signOut = (dispatch) => {
    return({email, password})=>{
    };
};

export const {Provider, Context} = CreateDataContext (
    authReducer,
    {},
    {isSignedIn: false}
);

标签: functionreact-nativereduxreact-redux

解决方案


我发现了这个问题。我错过了方法的导出。

我补充说:

export const {Provider, Context} = CreateDataContext (
    authReducer,
    {signIn, signOut, signup},
    {isSignedIn: false, errorMessage: ''}
);

该方法现在可见!


推荐阅读