码迷,mamicode.com
首页 > 其他好文 > 详细

redux-thunk初步使用

时间:2019-06-20 11:03:00      阅读:129      评论:0      收藏:0      [点我收藏+]

标签:==   reduce   user   params   使用   bsp   ram   nec   初步   

redux中间件,用来处理异步action

返回 一个函数  内部函数接收存储方法dispatchgetState参数

demo:

import { GET_ONLINE_STATUS, SET_ONLINE_STATUS} from ‘./action_type‘
import { changestatus, sysuserstatus } from ‘@/api‘
import { message } from ‘antd‘;
const getOnlineStatusAction = (val)=>{  //action
    return {
        type:GET_ONLINE_STATUS,
        playload:{
            text:val
        }
    }
}

export const getOnlineStatus = (params)=>{ 
    return (dispatch, getState)=>{              //返回 thunk 函数
        sysuserstatus(params).then(res=>{
            if(res.Ret === 200){
                dispatch(getOnlineStatusAction(res.Status)) 
            }
        })
    }
}



//组建中使用
const mapStateToProps = (state, ownProps) => ({
    status:state.handleOnlineStatus.onLineStatus //用户在线状态(state.handleOnlineStatus 此处这样用是因为reducer中使用了redux中的combineReducers()函数)
})
const mapDispatchToProps = {
    getOnlineStatus,
    setOnlineStatus
}
@connect(mapStateToProps,mapDispatchToProps)
class{}

 

redux-thunk初步使用

标签:==   reduce   user   params   使用   bsp   ram   nec   初步   

原文地址:https://www.cnblogs.com/cuikaitong/p/11057227.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!