使用道德状态在另一个状态下使用redux

时间:2017-12-17 10:19:44

标签: react-native react-redux

我有2个组件叫做OTP和用户
在用户中我收到输入号码,我需要在OTP组件中按下按钮时显示此号码 我使用redux并接收所有状态,但不是在一个状态这里是我的代码

Action.js

import {
    SET_USER, SET_USER_FAILURE, SET_USER_OTP_FAILURE, SET_USER_OTP_REQUEST, SET_USER_OTP_SUCCESS, SET_USER_REQUEST,
    SET_USER_SUCCESS,
} from "./Type";
import {Alert} from "react-native";
import {Actions} from 'react-native-router-flux';



export const setUserRequest =(user) => (dispatch,getState) => {
    console.log(user);
    fetch("http://localhost:8000/mobileWebViews/v1/sendOtp/", {
        method: "POST",
        headers: {
            Accept: "application/json",
            "Content-Type": "application/json"
        },
        body: JSON.stringify({
            mobile:user,
            password:user,
            type:'otp'
        })
    })
        .then(response => response.json())
        .then(responseJson => {
            if(responseJson.status.toString() === 'ok'){
                // this.global.mobile = mobile;
                //console.log(responseJson);
                setUserSuccess(responseJson)
                Alert.alert('پیامک ارسال شد');
                Actions.replace('OTP');
                // Actions.Login(this.props.user);
                // console.log(this.props.user)

            }else if(responseJson.status.toString() === 'fail') {
                setUserFailure(error);
                //Alert.alert(responseJson.message.toString());
            }else{
                setUserFailure(error);
               // Alert.alert(responseJson.message.toString());
               // console.log(responseJson.message)
            }

        })
        .catch(error => {
            //setUserFailure(error)
            Alert.alert("Error"+JSON.stringify(error));
            // console.error(error);
        })
    dispatch({
        type:SET_USER_REQUEST,
        user:user,
    })

}


export const setUserSuccess =(user)=>({
    type:SET_USER_SUCCESS,
    user:user,
});

export const setUserFailure =(user)=>({
    type:SET_USER_FAILURE,
    user:user,
    error:true,
});



export const setUserRequestOTP =(OTP) => (dispatch) => {
    console.log(OTP);
    fetch("http://localhost:8000/mobileWebViews/v1/Login", {
        method: "POST",
        headers: {
            Accept: "application/json",
            "Content-Type": "application/json"
        },
        body: JSON.stringify({
           mobile:OTP,
            password:OTP,
            type:'Login'
        })
    })
        .then(response => response.json())
        .then(responseJson => {
            if(responseJson.status.toString() === 'ok'){
                // this.global.mobile = mobile;
                setUserSuccessOTP(responseJson)
                Alert.alert('پیامک ارسال شد');
                Actions.replace('OTP');
                UserData();

            }else if(responseJson.status.toString() === 'fail') {
                setUserFailureOTP(error);
               // Alert.alert(responseJson.message.toString());
            }else{
                setUserFailureOTP(error);
               // Alert.alert(responseJson.message.toString());
               // console.log(responseJson.message)
            }

        })
        .catch(error => {
            setUserFailureOTP(error)
            Alert.alert("Error"+JSON.stringify(error));
            // console.error(error);
        })
    dispatch({
        type:SET_USER_OTP_REQUEST,
        OTP:OTP,

    })
}

export const setUserSuccessOTP =(OTP)=>({
    type:SET_USER_OTP_SUCCESS,
    OTP:OTP,
});

export const setUserFailureOTP =(OTP)=>({
    type:SET_USER_OTP_FAILURE,
    OTP:OTP,
    error:true,
});

Type.js

export const SET_USER='SET_USER';
export const SET_USER_REQUEST='SET_USER_REQUEST';
export const SET_USER_SUCCESS='SET_USER_SUCCESS';
export const SET_USER_FAILURE='SET_USER_FAILURE';
export const SET_USER_OTP_REQUEST='SET_USER_OTP_REQUEST';
export const SET_USER_OTP_SUCCESS='SET_USER_OTP_SUCCESS';
export const SET_USER_OTP_FAILURE='SET_USER_OTP_FAILURE';

Reducers.js

import {combineReducers} from 'redux';
import user from './UserReducers';
import OTP from './UserReducers';
export default combineReducers({
    user,
    OTP,
})

UserReducers.js


import {SET_USER, SET_USER_OTP_SUCCESS, SET_USER_SUCCESS} from "../Actions/Type";

const initialState = {

    mobile:'',
    OTP:'',

}

export default  data =(state= initialState,action={}) =>{
    switch (action.type){
        case SET_USER_SUCCESS :
            const { user,OTP }=action;
            return {mobile:user.mobile}

        case SET_USER_OTP_SUCCESS:
            return {password:OTP.password}

            break;

        default:
            return state;

}
}

store.js

import {createStore,applyMiddleware, compose} from  'redux';
import thunk from 'redux-thunk';
import { createLogger } from "redux-logger";
import reducers from './../Reducers';

const middleware = [thunk];
middleware.push(createLogger());

const store= createStore(
    reducers,
    undefined,
    compose(
        applyMiddleware(...middleware),

    )
);

export default store;

0 个答案:

没有答案