Javascript React本机(使用Expo)Firebase身份验证
我正在尝试在我的应用程序上设置身份验证,但在触发dispatch方法的已创建的auth action signIn()上出现了以下错误。我能够在最近创建的Web应用程序上成功地使用此方法,并且希望在移动应用程序上使用与我希望使用Redux相同的方法。除了调用action signIn并通过Formik和Yup验证传递带有用户输入值的对象外,一切似乎都正常工作 警告:从submitForm()捕获到未经处理的错误,[TypeError:undefined不是对象(正在计算'\u ref.credentials')] registerWarning中的节点\u modules\react native\Libraries\LogBox\LogBox.js:117:10 我不知道为什么它不接受对象,因为从Formik收集的值是一个具有电子邮件和密码属性的对象 下面是代码。任何建议或解决方案都会大有帮助。谢谢Javascript React本机(使用Expo)Firebase身份验证,javascript,react-native,react-redux,firebase-authentication,expo,Javascript,React Native,React Redux,Firebase Authentication,Expo,我正在尝试在我的应用程序上设置身份验证,但在触发dispatch方法的已创建的auth action signIn()上出现了以下错误。我能够在最近创建的Web应用程序上成功地使用此方法,并且希望在移动应用程序上使用与我希望使用Redux相同的方法。除了调用action signIn并通过Formik和Yup验证传递带有用户输入值的对象外,一切似乎都正常工作 警告:从submitForm()捕获到未经处理的错误,[TypeError:undefined不是对象(正在计算'\u ref.crede
import { connect } from 'react-redux'
import { signIn } from '../store/actions/authActions'
import React, { useState } from 'react';
import { StyleSheet, Button, TextInput, View, Text,FlatList } from 'react-native';
import { globalStyles } from '../styles/global.js';
import { Formik } from 'formik';
import * as yup from 'yup';
import OrderButton from '../shared/orderButton';
const reviewSchema = yup.object({
email: yup.string().email('Invalid email.').required('Required'),
password: yup.string().required('Password is required'),
});
function SignInForm(props) {
const { signIn, auth, authError, navigation } = props;
const [focus, setFocus] = useState(props.focus);
console.log(signIn)
console.log(authError)
return (
<View style={globalStyles.container}>
<Formik
initialValues={{ email: '', password: '' }}
validationSchema={loginSchema}
onSubmit={(values, actions) => {
actions.resetForm();
signIn(values);
// tried this also still dont work signIn({values});
// tried this also still dont work signIn({ email: values.email, password: values.password });
if (auth.uid) navigation.navigate('Home')
}}
>
{props => (
<View>
<TextInput
style={globalStyles.input}
placeholder='Email'
onChangeText={props.handleChange('email')}
onBlur={props.handleBlur('email')}
value={props.values.email}
/>
{console.log(props.values.email)}
<Text style={globalStyles.errorText}>{props.touched.email && props.errors.email}</Text>
<TextInput
style={globalStyles.input}
placeholder='Password'
onChangeText={props.handleChange('password')}
onFocus={() => setFocus(true)}
onBlur={props.handleBlur('password')}
// secureTextEntry={secure}
value={props.values.password}
/>
<Text style={globalStyles.errorText}>{props.touched.password && props.errors.password}</Text>
<OrderButton text='submit' onPress={props.handleSubmit} />
{/* <FlatButton onPress={props.handleSubmit} text='submit' /> */}
</View>
)}
</Formik>
</View>
);
}
const mapStateToProps = (state) => {
return{
authError: state.auth.authError,
auth: state.firebase.auth
}
}
const mapDispatchToProps = (dispatch) => {
return {
signIn: ({ creds }) => dispatch(signIn(creds)),
// signUp: (creds) => dispatch(signUp(creds))
}
}
export default connect(mapStateToProps, mapDispatchToProps)(SignInForm)
// auth actions
export const signIn = (credentials) => {
return (dispatch, getState, {getFirebase}) => {
const firebase = getFirebase();
firebase.auth().signInWithEmailAndPassword(
credentials.email,
credentials.password
).then(() => {
dispatch({ type: 'LOGIN_SUCCESS' });
}).catch((err) => {
dispatch({ type: 'LOGIN_ERROR', err });
});
}
}
从'react redux'导入{connect}
从“../store/actions/authActions”导入{signIn}
从“React”导入React,{useState};
从“react native”导入{样式表、按钮、文本输入、视图、文本、平面列表};
从“../styles/global.js”导入{globalStyles};
从'Formik'导入{Formik};
从“是”以是的形式导入*;
从“../shared/OrderButton”导入OrderButton;
const reviewSchema=yup.object({
email:yup.string().email('Invalid email')。required('required'),
密码:yup.string().required('password is required'),
});
功能符号信息(道具){
const{signIn,auth,authError,navigation}=props;
const[focus,setFocus]=useState(props.focus);
控制台日志(登录)
console.log(authError)
返回(
{
actions.resetForm();
签名(价值观);
//尝试了这个也仍然不工作登录({values});
//尝试此操作后仍然无法登录({email:values.email,password:values.password});
if(auth.uid)navigation.navigate('Home')
}}
>
{props=>(
{console.log(props.values.email)}
{props.touch.email&&props.errors.email}
设置焦点(真)}
onBlur={props.handleBlur('password')}
//secureTextEntry={secure}
value={props.values.password}
/>
{props.touch.password&&props.errors.password}
{/* */}
)}
);
}
常量mapStateToProps=(状态)=>{
返回{
authError:state.auth.authError,
auth:state.firebase.auth
}
}
const mapDispatchToProps=(调度)=>{
返回{
签名:({creds})=>调度(签名(creds)),
//注册:(creds)=>调度(注册(creds))
}
}
导出默认连接(MapStateTrops、mapDispatchToProps)(SignInfo)
//授权操作
导出常量签名=(凭据)=>{
返回(dispatch,getState,{getFirebase})=>{
const firebase=getFirebase();
firebase.auth().使用Email和Password进行登录(
credentials.email,
凭据.密码
).然后(()=>{
分派({type:'LOGIN_SUCCESS'});
}).catch((错误)=>{
分派({type:'LOGIN_ERROR',err});
});
}
}