Question

我试图在React本机文档中找到任何道具，如何使用<Text/>隐藏Password文本，

我有一个动态的JS对象要显示，并使用map来处理：

renderProfile(){
  var tampil = this.state.data[0].detail.map((item, index)=>{
    return(
      <View key={index}>
        <Text>{item.Header} :</Text>
        {
          this.state.editProfile ?
          item.Header == 'Password' || item.Header == 'Username' || item.Header == 'Telepon' ?
          <View>
          <TextInput
            //MyProps
          />
          {item.Header=='Password' && this.state.editProfile ? <FontAwesome onPress={()=>{this.setState({hidePassword: !this.state.hidePassword})}} name="eye" size={20} color="#000"/> : null}
          </View>
          : <Text>{item.Value}</Text>
          : <Text>{item.Value}</Text>
        }
      </View>
    )
  })
  return tampil
}

我可以用<TextInput/>处理SecureTextEntry，但是在<Text/>上看不到SecureTextEntry props

是否可以在<Text/>组件中隐藏密码？

Answer 1

由于没有在Text中隐藏密码的道具，并且您想使用Text节点，因此可以制作自己的文本掩码。

securePasswordEntry (value) { 
  return value && value.replace(/./g, '*')
}

<Text>{securePasswordEntry(/*Text you want to secure*/)}<Text>

Answer 2

您应在密码字段中使用TextInput。

<View>
    <TextInput secureTextEntry={true}>
    </TextInput>
</View>

反应本机-处理<text>以使用像<textinput>这样的“ SecureTextEntry”

2 个答案: