我正在尝试使用本机secureTextEntry
隐藏我的密码并在注册过程中确认密码字段。我正在为textInput使用自定义InputBox组件。下面是我的代码,
<InputBox
error={this.state.PwordError}
keyboardType={'default'}
onChangeText={Pword =>
this.setState({
Pword
})
}
secureTextEntry={true}
value={this.state.Pword}
pHolder={"Password"}
color={'white'} />
<View style={styles.spacer} />
<InputBox
error={this.state.CPwordError}
keyboardType={'default'}
onChangeText={CPword =>
this.setState({
CPword
})
}
secureTextEntry={true}
value={this.state.CPword}
pHolder={"Confirm Password"}
color={'white'} />
输入密码后,第一个文本框可以正常显示为点,但确认密码字段不起作用。有谁知道为什么会发生这种情况?
这是上面的代码所引用的输入框
<TextInput
underlineColorAndroid="transparent"
placeholder={this.props.pHolder}
placeholderTextColor={this.props.color === 'white' ? 'black':"white" }
{...this.props}
style={this.props.color == 'white' ? styles.ReginputStyle : styles.inputStyle}
/>
我正在使用
"react": "16.5.0",
"react-native": "0.57.1",
我能够通过从输入组件中删除keyboardType={'default'}
代码来解决此问题。即使问题已解决,我也想知道第一个secureTextEntry
框为什么不能工作而另一个却不能工作的原因,因为除了值外,它们都相同。谁能给出原因说明为什么会发生这种情况,
谢谢。
答案 0 :(得分:1)
执行keyboardType="default"
,它将起作用。它对我有用。
答案 1 :(得分:0)
我不知道为什么它会在您的代码中发生,我已经尝试过您的代码,在我的android模拟器中可以正常工作。而不是这个,我在更新阴影类型为“ AndroidTextInput”的阴影节点时遇到了问题。因为评估您的
需要花费时间为此,我删除了这条线,但它的工作正常。
import React, { Component } from "react";
import { View, Text, TouchableOpacity, TextInput } from "react-native";
export default class App extends Component {
constructor(props) {
super(props);
this.state = { CPwordError: "", CPword: "", PwordError: "", Pword: "" };
}
render() {
return (
<View>
<InputBox
error={this.state.PwordError}
keyboardType={"default"}
onChangeText={Pword =>
this.setState({
Pword
})
}
secureTextEntry={true}
value={this.state.Pword}
pHolder={"Password"}
// color={"white"}
/>
<InputBox
error={this.state.CPwordError}
keyboardType={"default"}
onChangeText={CPword =>
this.setState({
CPword
})
}
secureTextEntry={true}
value={this.state.CPword}
pHolder={"Confirm Password"}
// color={"white"}
/>
</View>
);
}
}
class InputBox extends Component {
constructor(props) {
super(props);
}
render() {
return (
<View>
<TextInput
underlineColorAndroid="transparent"
placeholder={this.props.pHolder}
placeholderTextColor={"black"}
{...this.props}
style={this.props.color == "white"}
/>
</View>
);
}
}
答案 2 :(得分:0)
multiline = {true}或keyboardType = {'visible-password'}阻止secureTextEntry正常工作。
答案 3 :(得分:0)
keyboardType="default" Working Fine.
secureTextEntry={hidePassword}
<TextInput
style={[styles.textInput]}
placeholder=""
secureTextEntry={hidePassword}
selectionColor={'#000'}
editable={true}
returnKeyType={'next'}
keyboardType="default"
autoFocus={false}
autoCapitalize={'characters'}
placeholderTextColor="rgb(153,153,153)"
onChangeText={(text) => this.onCurrentPassTextChange(text)}
>{currentPassword}</TextInput>