时间戳

首页 > 解决方案 > 使用文本输入 React Native 自动填充密码

react-native - 使用文本输入 React Native 自动填充密码

问题描述

根据文档，如果我们将 textContentType 设置为用户名和密码，键盘应该有一个自动填充选项。但不知何故它对我不起作用。

              <TextInput
                textContentType='username'
                style={{ width: 300, height: 50, borderWidth: 1 }}
                value={this.state.currentEmail}
                onChangeText={this.handleChangeTextEmail}
              />
              <TextInput
                textContentType='password'
                value={this.state.currentPassword}
                textContentType="password"
                style={{ width: 300, height: 50, borderWidth: 1, marginTop: 10 }}
                onChangeText={this.handleChangeTextPassword}
                secureTextEntry
              />

有没有人面临同样的问题，或者有没有办法解决这个问题？
编辑：
我正在使用 Iphone X（真实设备）Iphone 11（模拟器）两个 ios 版本都是 11+

标签： react-native

解决方案

  1. 什么样的设备会面临这个问题？
  2. 什么样的操作系统 iOS/Android 版本？
  3. 我认为建议自动填充它应该包含的密码链，password而username不是emailAddress

https://reactnative.dev/docs/next/textinput#textcontenttype-ios

对于 iOS 11+，您可以设置textContentType或username启用password从设备钥匙串自动填充登录详细信息。

如果v11+

<TextInput
    value={this.state.username}
    textContentType="username"
/>
<TextInput
    value={this.state.password}
    secureTextEntry={true}
    textContentType="password"
/>

如果v12+

<TextInput
    value={this.state.username}
    textContentType="username"
/>
<TextInput
    value={this.state.password}
    secureTextEntry={true}
    textContentType={"password" | "newPassword"} // newPassword if suggest & save into cahins
/>

更新日期：2021 年 7 月 10 日

  1. 确保打开钥匙串自动填充

使用 iCloud 钥匙串：设置 → Apple ID → iCloud → 钥匙串 → 切换“打开”iCloud 钥匙串。

就像这里https://reactnative.dev/docs/next/textinput#passwordrules-ios

推荐阅读