gpt4 book ai didi

javascript - Undefined 不是一个对象(评估 'this.state.username' )

转载 作者:行者123 更新时间:2023-11-30 20:07:55 27 4
gpt4 key购买 nike

<分区>

我是 React Native 的菜鸟,刚开始学习它。我想使用 React Native 构建 Android 应用程序。

现在,我有一个基本的登录表单,它将向服务器发送获取请求并显示用户是否已获得授权。

但是当我尝试提醒输入字段的值时,它会抛出错误“未定义不是对象”

我指的是官方文档here ,此代码有效。我也尝试过基本的 react 形式 here .我正在使用 UI kitten text input对于输入,我也使用了原生的 React TextInput,它给出了同样的错误。

我当前的代码是:

import React from 'react';
import { Alert, StyleSheet, Text, TextInput, View } from 'react-native';
import {RkButton, RkText, RkTextInput, RkCard} from 'react-native-ui-kitten';
import Icon from 'react-native-vector-icons/Ionicons';

export default class App extends React.Component {
constructor(props) {
super(props);

this.state = {
username: '',
password: ''
};

this.handleChange = this.handleChange.bind(this);
}

handleChange(event) {
const target = event.target;

this.setState({
username: target.username,
password: target.password
});
}


login()
{
Alert.alert(this.state.username) //getting error here

let data = {
method: 'POST',
credentials: 'same-origin',
mode: 'same-origin',
body: JSON.stringify({
username: this.state.username,
password: this.state.password
}),
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
}
}
fetch('http://demourl.com/login',data)
.then((response) => response.json())
.then((responseJson) => {
if (responseJson.success == 'true') {
Alert.alert('Login Successfull!')
}
else {
Alert.alert('Login Failed')
}
})
.catch((error) => {
console.error(error);
});
;
}

render() {
return (
<View style={styles.container}>
<RkCard style={{padding: 20}}>
<View style={{alignItems: 'center',padding: 10}}>
<RkText rkType='warning large' style={{fontSize: 40}}>Log In</RkText>
</View>
<View style={{alignItems: 'center',padding: 10}}>
<RkTextInput placeholder='Username' value={this.state.username} onChange={this.handleChange} />
<RkTextInput placeholder='Password' value={this.state.password} onChange={this.handleChange}/>
</View>
<View style={{alignItems: 'center',padding: 10}}>
<RkButton rkType='success small' title="Press Me"
onPress={this.login}
>Log In!</RkButton>
</View>
</RkCard>
</View>
);
}
}

const styles = StyleSheet.create({
container: {
marginTop: 65,
backgroundColor: '#fff',
justifyContent: 'center',
padding: 10
},
});

请告诉我我在哪里无法理解工作原理。或者我的代码哪里有问题。提前致谢。

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com