react-redux之mapDispatchToProps与mapStateToProps多种写法
mapDispatchToProps多种写法
传统写法:
const mapDispatchToProps = (dispatch)=>{
return {
abc:aaa=>{
// console.log('ADD')
dispatch({
type:'ADD',
id:num++,
text:aaa,
})
},
qqw:aaa=>{
// console.log('TYY')
dispatch({
type:'TYY',
id:num++,
text:aaa,
})
},
noa:aaa=>{
// console.log('nono')
dispatch({
type:'nono',
id:num++,
text:aaa,
})
}
}
}
const faActionCreators = {
abc:aaa=>{
return {
type:'ADD',
id:num++,
text:aaa,
}
},
qqw:aaa=>({
type:'TYY',
id:num++,
text:aaa,
}),
noa:aaa=>({
type:'nono',
id:num++,
text:aaa,
})
}
//方法二
const mapDispatchToProps = faActionCreators;
//方法三
const mapDispatchToProps = (dispatch) => {
return bindActionCreators(faActionCreators, dispatch);
};
mapStateToProps多种写法
1、经典写法
//mapStateToProps第一种写法
const mapStateToProps = (state)=>{
return ({addRedux:state.addRedux})
};
2、mapStateToProps 返回函数的方法
//mapStateToProps第二种写法
// mapStateToPropsCreator 其实就是正常写法、第一种写法的mapStateToProps
const mapStateToPropsCreator = (state)=>{
return ({addRedux:state.addRedux})
};
//这种写法的好处就是能够在每次执行mapStateToProps都可以使用初始状态initstate
const mapStateToProps = (initstate,ownprops)=>{
console.log(initstate);
return mapStateToPropsCreator;
};