redux中的reducer合并使用,怎么合并reducer

6 篇文章 0 订阅
1 篇文章 0 订阅

redux文件

redux
第一个文件: actions.js

export const AUTH = 'auth/AUTH';

export const LOGIN = 'auth/LOGIN';
export const LOGIN_SUCCESS = 'auth/LOGIN_SUCCESS';
export const LOGIN_FAIL = 'auth/LOGIN_FAIL';

export const COMMON_SUCCESS = 'auth/COMMON_SUCCESS';
export const COMMON_ERROR = 'auth/COMMON_ERROR';

第一个reducer auth.js

import {
  AUTH,
  LOGIN,
  LOGIN_SUCCESS,
  LOGIN_FAIL,
  COMMON_SUCCESS,
  COMMON_ERROR
} from './actions'

const initialState = {
  loaded: false
};

export default function reducer(state = initialState, action = {}) {
  switch (action.type) {
    case AUTH:
      return {
        ...state,
        auth: action.data
      };
    case LOGIN:
      return {
        ...state,
        requesting: true,
        requested: false
      };
    case LOGIN_SUCCESS:
      return {
        ...state,
        requesting: false,
        requested: true,
        loginError: action.res.data.message
      };
    case COMMON_ERROR:
      return {
        ...state,
        requesting: false,
        requested: true,
        loginError: action.error
      };
    case COMMON_SUCCESS:
      return {
        ...state,
        requesting: false,
        requested: true
      };
    case LOGIN_FAIL:
      return {
        ...state,
        requesting: false,
        requested: true,
        loginError: action.error
      };
    default:
      return state;
  }
}

// vanish预审核页面发送 自动发送失败 动用这个接口
export function sendVanishMessage(option) {
  return {
    types: [COMMON_SUCCESS, COMMON_ERROR],
    promise: axios.get(`/service_mana/`, {params: option})
  };
}

// 获取验证码
export function getCode(option) {
  return {
    types: [COMMON_SUCCESS, COMMON_ERROR],
    promise: axios.get(`/service`, {params: option})
  };
}

第二个reducer mydocument.js

import {
  AUTH,
  COMMON_SUCCESS,
  COMMON_ERROR
} from './actions'

const initialState = {
  dct: false
};

export default function reducer(state = initialState, action={}) {
  switch (action.type) {
    case AUTH:
      return {
        ...state,
        dct: action.data
      };
    case COMMON_ERROR:
      return {
        ...state,
        loginError: action.error
      };
    case COMMON_SUCCESS:
      return {
        ...state
      };
    default:
      return state;
  }
}

// 类目列表
export function getLabelList(option) {
  return {
    types: [COMMON_SUCCESS, COMMON_ERROR],
    promise: axios.get(`/service_mana/`, {params: option})
  };
}

出口 index.js

/* eslint-disable import/no-named-as-default */
import {combineReducers} from 'redux';
import auth from './auth'; // 引入auth reduce
import mydocument from './mydocument';

// 合并多个reduce
export default combineReducers({
  auth,
  mydocument
});

在文件中的用法

import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import * as authActions from '../../redux/reduces/auth';
import * as authAction from '../../redux/reduces/mydocument';```


@connect(
  state => ({auth: state.auth, mydocument: state.mydocument}),
  dispatch => ({
    auths: bindActionCreators(authActions, dispatch),
    documents: bindActionCreators(authAction, dispatch)
  })
)

const {getInterUrlListByAdmin} = this.props.auths;
getInterUrlListByAdmin(option).then((res) => {
  console.log(res);
});

const {updateUrl} = this.props.documents;
updateUrl().then((res) => {
  if (res.res.data.flag === 0) {
    message.info('修改成功');
  } else {
    message.info(res.res.data.msg);
  }
});

交流是成长的营养剂,欢迎切磋!

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值