所以我确保connect
mapDispatchToProps
我的import React from 'react';
import {View, Button} from 'react-native';
import { DrawerNavigator, DrawerItems } from 'react-navigation';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import aboutScreen from './About';
import settingScreen from './Setting';
import Home from './Home';
import Login from '../../auth/scenes/Login';
import * as authAction from '../../auth/actions';
import * as homeAction from '../actions';
export const mapDispatchToProps = (dispatch) => ({
actionsHome: bindActionCreators(homeAction, dispatch),
actionsAuth: bindActionCreators(authAction, dispatch)
});
const CustomDrawerContentComponent = (props) => (
<View>
<DrawerItems {...props}/>
<Button title="Logout" onPress={()=>props.screenProps()}/>
</View>
);
const Drawer = DrawerNavigator({
Home: {
screen: Home
},
About: {
screen: aboutScreen
},
Setting:{
screen: settingScreen
},
},
{
initialRouteName: 'Home',
contentComponent: CustomDrawerContentComponent,
drawerOpenRoute: 'DrawerOpen',
drawerCloseRoute: 'DrawerClose',
drawerToggleRoute: 'DrawerToggle'
}
);
class DrawNav extends React.Component{
constructor(){
super();
this.onSignOut = this.onSignOut.bind(this);
}
onSuccess() {
this.props.actionsHome.successSignOut();
Actions.reset("Auth");
}
onError(error) {
Alert.alert('Oops!', error.message);
}
onSignOut() {
this.props.actionsAuth.signOut(this.onSuccess.bind(this),this.onError.bind(this))
}
render(){
return <Drawer screenProps = {this.onSignOut}/>;
}
}
export default connect(mapDispatchToProps) (DrawNav);
正确并且正确地约束了我的功能,并且确保没有拼写错误。
但由于某种原因,下面给我发送的代码不是函数错误:
Dockerfile
我在我的Home组件上尝试了类似的设置,但它确实有效。这只是Home logout原理图中的一个副本粘贴,因为我需要在抽屉上注销按钮而不是Home。
任何人都可以帮我指出我在这里想念的是什么吗?
提前致谢! :)
答案 0 :(得分:1)
尝试:
export default connect(null, mapDispatchToProps) (DrawNav);
mapDispatchToProps
应该是connect
方法的第二个参数。
提供给connect
中第一个函数参数的参数将为state
,第二个参数函数将被赋予dispatch
在您的示例中,由于mapDispatchToProps
是connect
中的第一个参数,因此它正在接收state
作为其参数。然后你的bindActionCreators
会尝试将其作为一个函数来调用它,这就是你的错误。