React开发笔记(三)注册页面reducer配置

user.redux.js代码

注意axios是异步的,要传回调函数dispatch动作

import axios from 'axios';
const REGISTER_SUCCESS = 'REGISTER_SUCCESS';  //actionType
const ERROR_MESSAGE = 'ERROR_MESSAGE';   //actionType
const initState = {
    isAuth:false,
    msg:'',
    username:'',
    upwd:'',
    type:'',
}
export const user = (state=initState,action)=>{   //reducer
	switch(action.type){
		case REGISTER_SUCCESS:
		  return { ...state, ...action.data, msg:'', isAuth:true }
		case ERROR_MESSAGE:
		  return { ...state , msg:action.msg ,  isAuth:false }
		default 
		  return state ;
	}
}

function RegisterSucc(data){   //actionCreater
	return { data,type:REGISTER_SUCCESS } ;
}

function ErrorMsg(msg){   //actionCreater
	return { msg,type:ERROR_MESSAGE } ;
}

export const register = ({username,upwd,repeatUpwd,type})=>{  //处理注册表单
	if(!username||!upwd||!repeatUpwd){
		return ErrorMsg('用户名密码不能为空');
	}
	if(upwd!==repeatUpwd){
		return ErrorMsg('两次输入密码不正确');
	}
	return (dispatch)=>{
        axios.post('/user/register',{ username,upwd,repeatUpwd,type })
         .then(res=>{
         	if(res.status==200&&res.data.code===0){
         		dispatch(RegisterSucc(res.data));
         	}else{
         		dispatch(ErrorMsg(res.data.msg))
         	}
         })
    }
}

把reducer user 暴露出去,用combineReducers打包一下。

 

import { combineReducers } from 'redux';
import { user } from '../redux/user.redux.js'
export default combineReducers({ user });

这样就能生成user register 相关的store了。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值