Article From:https://segmentfault.com/q/1010000011701439
Question:

Update question:
rootreducerCode:

import { combineReducers } from 'redux';

import login from './login';

const rootReducer = combineReducers({ login });

export default rootReducer;

Among themloginreducersCode:

import * as types from '../constants/ActionTypes';

const initialState = {
  loading: false,
  params: {},
  cdata: {}
};

export default function login(state = initialState, action) {
  switch (action.type) {
    case types.FETCH_LOGIN:
      return Object.assign({}, state, {
        loading: action.loading
      });
    case types.RECEIVE_LOGIN:
      return Object.assign({}, state, {
        params: action.params,
        isLoadMore: false,
        cdata: action.cdata,
        loading: !!state.cdata
      });
    default:
      return state;
  }
}

Update question:
appComponent source:

import { Platform } from 'react-native';
import { StackNavigator, TabNavigator } from 'react-navigation';

import { pxToDp } from '../utils/ScreenUtil';

import Splash from '../pages/Splash';

import HomePage from '../pages/homePage/index';
import LoginContainer from '../containers/LoginContainer';
import LearnSituation from '../pages/learnSituation/index';
import Interaction from '../pages/interaction/index';
import My from '../pages/my/index';
import PreparLessons from '../pages/prelessons/prelessons'

const TabContainer = TabNavigator(
  {
    HomePage: { screen: HomePage },
    LearnSituation: { screen: LearnSituation },
    Interaction: { screen: Interaction },
    My: { screen: My }
  },
  {
    lazy: true,
    tabBarPosition: 'bottom',
    animationEnabled: false,
    tabBarOptions: {
      activeTintColor: '#00A774',
      inactiveTintColor: '#444444',
      showIcon: true,
      style: {
        backgroundColor: '#fff',
        height: pxToDp(100)
      },
      indicatorStyle: {
        opacity: 0
      },
      labelStyle: {
        fontSize: pxToDp(25),
        marginTop: pxToDp(-5)
      },
    }
  }
);

const App = StackNavigator(
  {
    Splash: { screen: Splash },
    Login: { screen: LoginContainer },
    PreparLessons: { screen: PreparLessons },
    Home: { screen: TabContainer }
  },
  {
    headerMode: 'screen',
    navigationOptions: {
      headerStyle: {
        backgroundColor: 'white',
        ...Platform.select({
          ios: {
            height: pxToDp(130)
          },
          android: {
            height: pxToDp(90)
          },
        }),
        paddingLeft: pxToDp(24),
        paddingRight: pxToDp(24),
        borderBottomColor: '#F3F3F3',
        borderBottomWidth: pxToDp(1),
        borderStyle: 'solid'
      },
      headerTitleStyle: {
        fontSize: pxToDp(41),
        fontWeight: 'normal',
        color: '#0F0F0F',
        alignSelf: 'center'
      },
      headerTintColor: 'black'
    },
    initialRouteName: 'Login'
  }
);

export default App;

Update question:
Printingconst store = configureStore();Middlestore

Picture!!! What is this problem? What can I do? Help!!!!

The code is as follows:
App.js

import React from 'react';
import { Provider } from 'react-redux';
import configureStore from './app/store/configure-store';
import rootSaga from './app/sagas/index';
import App from './app/containers/app';

const store = configureStore();

store.runSaga(rootSaga);

const Root = () => (<Provider store={store}>
  <App />
</Provider>);
export default App;

amongconfigure-storeIn configurationstore,The code is as follows:

import { createStore, applyMiddleware } from 'redux';
import createSagaMiddleware, { END } from 'redux-saga';

import rootReducer from '../reducers/index';

const middlewares = [];
const { logger } = require('redux-logger');

// Configuring sgag MiddlewareConst sagaMiddleware = createSagaMiddleware ();Middlewares.push (sagaMiddleware);/ / if it is a development ringBorderIf (__DEV__) {Middlewares.push (logger);}Const createStoreWithMiddleware = applyMiddleware (...Middlewares) (createStore);Export default function configureStore (initialState) {Const store = CReateStoreWithMiddleware (rootReducer, initialState);/ / run SagaStore.runSaga = sagaMiddleware.ruN;Store.close = () => store.dispatch (END);Return store;}

My landing page codelogin.js

import React, { Component } from 'react';
import {
    View,
    StatusBar
} from 'react-native';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import Page from './Page';
import * as loginCreators from '../../actions/login';

class Login extends Component {
    static navigationOptions = {
        header: null
    };

    render() {
        return <View>
            <StatusBar
                backgroundColor="#00000000"
                barStyle="light-content"
                translucent={true}
            />
            <Page {...this.props} />
        </View>;
    }
}

const mapStateToProps = (state) => {
    const { login } = state;
    return {
        login
    };
};

const mapDispatchToProps = (dispatch) => {
    const loginActions = bindActionCreators(loginCreators, dispatch);
    return {
        loginActions
    };
};

export default connect(mapStateToProps, mapDispatchToProps)(Login);

Among themPageThe sub page code is as follows:

import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    TouchableOpacity,
    Image,
    View,
    TextInput
} from 'react-native';
import store from 'react-native-simple-store';
import { GenerateToken } from '../../constants/TokenSalt';
import { pxToDp } from '../../utils/ScreenUtil';
import gl_styles from '../../style/global';

class Page extends Component {
    constructor(props) {
        super(props);
        this.state = {
            username: '0800211001',
            password: ''
        }
    }

    ActionLogin = () => {
        var params = {
            code: this.state.username,
            paw: this.state.password
        };
        if (params.code == "") {
            alert("Please enter user name "";Return;}If (params.paw = = "") {Alert ("password can not be empty");Return;}Object.assign (params, GenerateToken (params));/ / conSt {loginActions} = this.props;/ / loginActions.requestLogin (true, params);}RenDer () {Return (//ui code)}}Const styles = StyleSheet.create ({)/ / style});Export default Page;

I use it.react-reduxandredux-sagaIn development

Answer 0:

rootReducerHow do I write loginReducer inside?

Answer 1:

No Provider components.

Similar Posts:

Leave a Reply

Your email address will not be published. Required fields are marked *