[英]onPress and onChangeText doing nothing in React Native
我的onPress
和onChangeText
函數什么也不做。 如果輸入值,則會收到此錯誤消息
_this.setState is not a function. (In '_this.setState({
username: username
})', '_this.setState' is undefined)
應用程序/ index.js
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
username: "",
password: ""
};
this._handlePress = this._handlePress.bind(this)
}
_handlePress = () => {
const { username } = this.state;
const { password } = this.state;
Alert.alert(username);
Alert.alert(password);
onSignIn().then(() => navigation.navigate("SignedIn")); //also not working
}
/**/
render() {
/**/
}
}
應用程序/屏幕/ SignIn.js
import React from "react";
export default ({navigation, _handlePress}) => (
<View style={{ paddingVertical: 20 }}>
<Card title="SIGN IN">
<FormLabel>Email</FormLabel>
<FormInput
placeholder="Email address..."
onChangeText={username => this.setState({username})}
/>
<FormLabel>Password</FormLabel>
<FormInput
secureTextEntry
placeholder="Password..."
onChangeText={password => this.setState({password})}
/>
<Button
buttonStyle={{ marginTop: 20 }}
backgroundColor="#03A9F4"
title="SIGN IN"
onPress={this._handlePress}
/>
</Card>
</View>
);
您會收到此錯誤,因為SignIn.js js只是一個函數,而不是Component類。 因此函數的“ this”沒有任何“ setstate”方法。 您需要像這樣在react類中編寫組件
class Signin extends React.Component{
<View style={{ paddingVertical: 20 }}>
<Card title="SIGN IN">
<FormLabel>Email</FormLabel>
<FormInput
placeholder="Email address..."
onChangeText={username => this.setState({username})}
/>
<FormLabel>Password</FormLabel>
<FormInput
secureTextEntry
placeholder="Password..."
onChangeText={password => this.setState({password})}
/>
<Button
buttonStyle={{ marginTop: 20 }}
backgroundColor="#03A9F4"
title="SIGN IN"
onPress={this._handlePress}
/>
</Card>
</View>
}
// i have cloned your repo and run it successfully, by moving username
// and password from index.js to SignIn.js, rewrite SignIn in class way,
// navigation works well(jump to signed successfuly after pressing).
// however not sure if this is what you need.
import React, {Component} from "react";
import { View, Alert } from "react-native";
import { Card, Button, FormLabel, FormInput } from "react-native-elements";
export default class SignIn extends Component {
constructor (props) {
super(props);
this.state = {
username: '',
password: ''
}
}
_handlePress () {
let {navigation} = this.props;
navigation.navigate("SignedIn")
}
_handleUChange (username) {
this.setState({username})
}
_handlePChange (password) {
this.setState({password})
}
render () {
return (
<View style={{ paddingVertical: 20 }}>
<Card title="SIGN IN">
<FormLabel>Email</FormLabel>
<FormInput
placeholder="Email address..."
onChangeText={this._handleUChange.bind(this)}
/>
<FormLabel>Password</FormLabel>
<FormInput
secureTextEntry
placeholder="Password..."
onChangeText={this._handlePChange.bind(this)}
/>
<Button
buttonStyle={{ marginTop: 20 }}
backgroundColor="#03A9F4"
title="SIGN IN"
onPress={this._handlePress.bind(this)}
/>
</Card>
</View>
)
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.