如何在不使用反应本机状态的情况下获取 TextInput 值 android
how to get TextInput value without using state in react native android
我在这里尝试使用 const 值用户名和密码获取 TextInput 值,但未定义。如何在此使用状态或道具。我遵循了本教程 https://medium.com/react-native-training/react-native-navigator-experimental-part-2-implementing-redux-c6acbf66eca1#.d0vteepp7
import React, { Component } from 'react'
import {
View,
Text,
TextInput,
Alert
} from 'react-native'
import Button from './Button'
const route = {
type: 'push',
route: {
key: 'about',
title: 'About'
}
}
const _values = {
username: '',
password: ''
}
const LoginView = ({_handleNavigate}) => {
const _handlePress = () => {
const {username, password} = _values
console.log('username' + username + "" + password);
return fetch('http://webservice.net/User/ValidateUser', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
UserName: username,
Password: password,
DeviceType: 'Android',
DeviceToken: 'eU0z3IR96Mg:APA91bHNyEw3CcMCHZ-MmGhFVRV8XT292NYzrD2xedMFLXdaJqcJ4DXlBmn'
})
}).then(response => response.json())
.then(response => {
console.log(response);
Alert.alert('Response message is:', response.parse)
_handleNavigate(route)
return response;
})
.catch(error => {
console.error(error);
});
};
return (
<View style={{ flex: 1, backgroundColor: 'steelblue', padding: 10, justifyContent: 'center' }}>
<Text style={{ backgroundColor: 'steelblue', justifyContent: 'center', alignItems: 'center', fontSize: 40, textAlign: 'center', color: 'white', marginBottom: 30 }}>
LOGIN
</Text>
<View style={{ justifyContent: 'center' }}>
<TextInput
style={{ height: 40, margin: 30, color: 'white', fontSize: 20 }}
placeholder='Username' placeholderTextColor='white'
autoFocus={true}
/>
<TextInput
secureTextEntry={true}
style={{ height: 40, margin: 30, color: 'white', fontSize: 20 }}
placeholder='Password' placeholderTextColor='white'
/>
</View>
<Button onPress={() => { _handlePress() } } label='Login' />
</View>
)
}
export default LoginView
您可以附加 TextInput
's onChangeText
event' 处理程序并存储其参数,例如:
<TextInput
onChangeText={(val) => _values.username = val}
...
/>
我在这里尝试使用 const 值用户名和密码获取 TextInput 值,但未定义。如何在此使用状态或道具。我遵循了本教程 https://medium.com/react-native-training/react-native-navigator-experimental-part-2-implementing-redux-c6acbf66eca1#.d0vteepp7
import React, { Component } from 'react'
import {
View,
Text,
TextInput,
Alert
} from 'react-native'
import Button from './Button'
const route = {
type: 'push',
route: {
key: 'about',
title: 'About'
}
}
const _values = {
username: '',
password: ''
}
const LoginView = ({_handleNavigate}) => {
const _handlePress = () => {
const {username, password} = _values
console.log('username' + username + "" + password);
return fetch('http://webservice.net/User/ValidateUser', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
UserName: username,
Password: password,
DeviceType: 'Android',
DeviceToken: 'eU0z3IR96Mg:APA91bHNyEw3CcMCHZ-MmGhFVRV8XT292NYzrD2xedMFLXdaJqcJ4DXlBmn'
})
}).then(response => response.json())
.then(response => {
console.log(response);
Alert.alert('Response message is:', response.parse)
_handleNavigate(route)
return response;
})
.catch(error => {
console.error(error);
});
};
return (
<View style={{ flex: 1, backgroundColor: 'steelblue', padding: 10, justifyContent: 'center' }}>
<Text style={{ backgroundColor: 'steelblue', justifyContent: 'center', alignItems: 'center', fontSize: 40, textAlign: 'center', color: 'white', marginBottom: 30 }}>
LOGIN
</Text>
<View style={{ justifyContent: 'center' }}>
<TextInput
style={{ height: 40, margin: 30, color: 'white', fontSize: 20 }}
placeholder='Username' placeholderTextColor='white'
autoFocus={true}
/>
<TextInput
secureTextEntry={true}
style={{ height: 40, margin: 30, color: 'white', fontSize: 20 }}
placeholder='Password' placeholderTextColor='white'
/>
</View>
<Button onPress={() => { _handlePress() } } label='Login' />
</View>
)
}
export default LoginView
您可以附加 TextInput
's onChangeText
event' 处理程序并存储其参数,例如:
<TextInput
onChangeText={(val) => _values.username = val}
...
/>