我一直在尝试将Redux实现到React-Native注册应用程序中,我正在努力创建一个多页面表单设置。
为此,我需要相同的按钮来执行两个功能:
导航和状态处理。
我一直遇到麻烦,因为我一直收到错误,告诉我有问题的组件没有附加方法。
有关此问题的代码可在此处查看:
import React from 'react';
import ReactNative from 'react-native';
import { AppRegistry,TextInput,View,StyleSheet} from 'react-native';
import { StackNavigator } from 'react-navigation'; //navigation between pages
import { FormLabel, FormInput,Button,Text } from 'react-native-elements'; //ui
import store from '../store/store'
import { Provider } from 'react-redux';
import Register2 from './namefields';
import { register1 } from '../actions/registration'
import {connect} from 'react-redux'
let styles = {}
class Register1 extends React.Component{
constructor (props) {
super(props);
this.state ={
email: '',
password: '',
};
}
empaRegister (e) {
this.props.onRegister1(this.state.email, this.state.password);
e.preventDefault();
}
render() {
const { navigate } = this.props.navigation;
return(
<View>
<FormLabel
containerStyle={styles.labelContainerStyle}>Email</FormLabel>
<FormInput
ref='form2'
containerRef='containerRefYOYO'
textInputRef='textInputRef'
placeholder='Please enter your email address...'
onChangeText = {(newValue) =>this.setState({email:newValue})}
/>
<FormLabel containerStyle={styles.labelContainerStyle}>Password</FormLabel>
<FormInput
ref='form1'
placeholder='Please create a password...'
onChangeText ={(newValue) =>this.setState({password:newValue}) }
/>
<Button title="Next" onClick={(e) => this.empaRegister(e); navigate('Register2'); }/>
</View>
);
}
}
const Application = StackNavigator({
Register1: {screen: Register1 },
Register2: {screen: Register2}
});
const mapDispatchToProps = (dispatch) => {
return {
onRegister1: (email, password) => { dispatch(register1(email, password)); }
}
}
export default connect(mapDispatchToProps)(Register1);
答案 0 :(得分:0)
你缺少一些{
和}
onClick={(e) => this.empaRegister(e); navigate('Register2'); }
应该是
onClick={(e) => {this.empaRegister(e); navigate('Register2'); }}
或者你可以做到
empaRegister (e) {
this.props.onRegister1(this.state.email, this.state.password);
navigate('Register2');
}
然后像这样使用它
onClick={(e) => this.empaRegister(e)}