问题描述
帮我解决这个问题,以便我进一步开展工作。 还有我可以为您提供的解决方案所需的所有其他文件。
profile.js
import React from "react";
import { StyleSheet,Text,View,StatusBar } from "react-native";
import { render } from "react-dom";
class Profile extends React.Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.textStyle}>This is the profile page </Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
backgroundColor: "#455a64",flex: 1,alignItems: "center",justifyContent: "center",},textStyle: {
color: "#fff",fontSize: 18,});
export default Profile;
signup.js
import React from "react";
import {
StyleSheet,StatusBar,TouchableOpacity,} from "react-native";
import { createNewUser } from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/actions/auth.actions.js";
import { render } from "react-dom";
import { connect } from "react-redux";
import Form from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/form.js";
import { compose } from "redux";
import logo from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/logo.js";
import SignupForm from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/signupform.js";
import { Actions } from "react-native-router-flux";
import { Field,reduxForm } from "redux-form";
import InputText from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/InputText.js";
import Loader from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/Loader.js";
class Signup extends React.Component {
goBack() {
Actions.pop();
}
createNewUser = (values) => {
this.props.dispatch(createNewUser(values));
};
onSubmit = (values) => {
this.createNewUser(values);
};
renderTextInput = (field) => {
const {
Meta: { touched,error },label,secureTextEntry,maxLength,keyboardType,placeholder,input: { onChange,...restInput },} = field;
return (
<View>
<InputText
onChangeText={onChange}
maxLength={maxLength}
placeholder={placeholder}
keyboardType={keyboardType}
secureTextEntry={secureTextEntry}
label={label}
{...restInput}
/>
{touched && error && <Text style={styles.errorText}>{error}</Text>}
</View>
);
};
render() {
const { createusers,handleSubmit } = this.props;
return (
<View style={styles.container}>
{createusers.isLoading && <Loader />}
<logo />
<Field
name="name"
placeholder=" First Name"
component={this.renderTextInput}
/>
<Field
name="name"
placeholder=" Last Name"
component={this.renderTextInput}
/>
<Field
name="email"
placeholder="Email"
component={this.renderTextInput}
/>
<Field
name="password"
placeholder="Password"
secureTextEntry={true}
component={this.renderTextInput}
/>
<TouchableOpacity
style={styles.button}
onPress={handleSubmit(this.onSubmit)}
>
<Text style={styles.buttonText}>Signup</Text>
</TouchableOpacity>
<View style={styles.signupTextCont}>
<Text style={styles.signupText}>Already have an account?</Text>
<TouchableOpacity onPress={this.goBack}>
<Text style={styles.signupButton}> Sign in</Text>
</TouchableOpacity>
</View>
</View>
);
}
}
const validate = (values) => {
const errors = {};
if (!values.name) {
errors.name = "First Name is required";
}
if (!values.name) {
errors.name = "Last Name is required";
}
if (!values.email) {
errors.email = "Email is required";
}
if (!values.password) {
errors.password = "Password is required";
}
return errors;
};
const styles = StyleSheet.create({
container: {
backgroundColor: "#455a64",signupTextCont: {
flexGrow: 1,alignItems: "flex-end",paddingVertical: 16,flexDirection: "row",signupText: {
color: "rgba(255,255,0.6)",fontSize: 16,signupButton: {
color: "#ffffff",fontWeight: "500",button: {
width: 300,backgroundColor: "#1c313a",borderRadius: 25,marginVertical: 10,paddingVertical: 13,buttonText: {
fontSize: 16,color: "#ffffff",textAlign: "center",errorText: {
color: "#ffffff",fontSize: 14,paddingHorizontal: 16,paddingBottom: 8,inputBox: {
width: 300,backgroundColor: "rgba(255,0.2)",});
mapStatetoProps = (state) => ({
createusers: state.authReducer.createusers,});
mapdispatchToProps = (dispatch) => ({
dispatch,});
export default compose(
connect(mapStatetoProps,mapdispatchToProps),reduxForm({
form: "register",validate,})
)(Signup);
auth.reducer.js
import { combineReducers } from "redux";
const createusers = (state = {},action) => {
switch (action.type) {
case "CREATE_USER_LOADING":
return {
isLoading: true,isError: false,isSuccess: false,errors: null,isLoggedIn: false,};
case "CREAT_USER_SUCCESS":
return {
isLoading: false,isSuccess: true,isLoggedIn: true,};
case "CREAT_USER_FAIL":
return {
isLoading: false,isError: true,errors: action.payload,};
default:
return state;
}
};
/*const authData = (state = {},action) => {
switch (action.type) {
case "AUTH_USER_SUCCESS":
return {
token: action.token,};
case "AUTH_USER_FAIL":
return {
token: null,};
default:
return state;
}
};
const loginUser = (state = {},action) => {
switch (action.type) {
case "LOGIN_USER_LOADING":
return {
isLoading: true,};
case "LOGIN_USER_SUCCESS":
return {
isLoading: false,};
case "LOGIN_USER_FAIL":
return {
isLoading: false,};
default:
return state;
}
};*/
export default combineReducers({
createusers,//loginUser,//authData,});
routes.js
import React,{ Component } from "react";
import {
StyleSheet,} from "react-native";
import { Router,Stack,Scene } from "react-native-router-flux";
import Login from "../pages/login.js";
import Signup from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/pages/signup.js";
import Profile from "../pages/profile.js";
class Routes extends React.Component {
render() {
return (
<Router>
<Scene>
<Scene key="root" hideNavBar={true} initial={!this.props.isLoggedIn}>
<Scene key="signup" component={Signup} title="Register" />
<Scene key="login" component={Login} />
</Scene>
<Scene key="app" hideNavBar={true} initial={this.props.isLoggedIn}>
<Scene key="profile" component={Profile} initial={true} />
</Scene>
</Scene>
</Router>
);
}
}
export default Routes;
Main.js
import React from "react";
import {
StyleSheet,} from "react-native";
import { render } from "react-dom";
import { createusers } from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/reducers/auth.reducer.js";
import { connect } from "react-redux";
import Routes from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/routes.js";
import { Actions } from "react-native-router-flux";
class Main extends React.Component {
render() {
const { createusers } = this.props;
console.log(this.props.createusers.isLoggedIn);
return (
<View style={styles.container}>
<StatusBar backgroundColor="#1c313a" barStyle="light-content" />
<Routes isLoggedIn={this.props.createusers.isLoggedIn} />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,});
mapStatetoProps = (state) => ({
createusers: state.authReducer.createusers,});`enter code here`
export default connect(mapStatetoProps,null)(Main);
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)