iOS 强密码自动填充未显示在确认密码上答案

【问题标题】：iOS Strong Password Autofill is not Showing on Confirm PasswordiOS 强密码自动填充未显示在确认密码上
【发布时间】：2018-12-22 12:13:31
【问题描述】：

iOS 会自动填写第一个密码字段，但不会自动填写第二个密码字段。如何让密码和确认密码字段像应用程序一样自动填充？

更新：系统似乎将注册表单视为登录表单，因此它会自动填充第一个密码字段。另外，当我导航回登录屏幕时，系统会提示我是否要将密码保存在钥匙串中，这是出乎意料的。

更新：我正在使用堆栈导航（屏幕：登录和注册）。结果我在注册表单中输入姓名或电子邮件后，它会自动将强密码填充到登录屏幕的密码字段和注册屏幕的第一个密码字段。有什么方法可以告诉系统这些是不同的形式吗？（就像在网络编程中使用不同的<form>）。

登录屏幕

export default class Login extends Component {
    Login() {

    }

    render() {
        return (
            <IndexBackground>
                <IndexBox>
                    <IndexLogo />
                    <IndexTextInput placeholder="Name" />
                    <IndexTextInput placeholder="Password" secureTextEntry={true}/>
                    <IndexButton title="Log in" onPress={this.Login} />
                    <IndexText text="Forgot Password?" style={styles.textForgot} />
                    <IndexText text="Don't have an account?" style={styles.textSignUp}>
                        <Text style={styles.textLink} onPress={() => this.props.navigation.navigate('SignUp')}> Sign up</Text>
                    </IndexText>
                </IndexBox>
            </IndexBackground>
        )
    }
}

注册屏幕

export default class SignUp extends Component {
    user = {
        email: '',
        name: '',
        pass: '',
        confirmpass: ''
    };

    setUser = (key, value) => {
        this.user[key] = value;
        console.log(this.user);
    }

    signUp() {

    }

    render() {
        return (
            <IndexBackground>
                <IndexBox>
                    <IndexLogo />
                    <IndexTextInput placeholder="Email" onTextChanged={(value) => this.setUser('email', value)} />
                    <IndexTextInput placeholder="Name" onTextChanged={(value) => this.setUser('name', value)} />
                    <IndexTextInput placeholder="Password" secureTextEntry={true} onTextChanged={(value) => this.setUser('pass', value)} />
                    <IndexTextInput placeholder="Confirm Password" secureTextEntry={true} onTextChanged={(value) => this.setUser('confirmpass', value)} />
                    <IndexButton title="Sign up" onPress={this.signUp} />
                    <IndexText text="Have an account?" style={styles.textSignUp}>
                        <Text style={styles.textLink} onPress={() => this.props.navigation.navigate('Login')}> Log in</Text>
                    </IndexText>
                </IndexBox>
            </IndexBackground>
        )
    }
}

导航登录

const routeConfigs = {
    Login: { screen: Login },
    SignUp: { screen: SignUp }
}

const navConfigs = {
    headerMode: 'none',
    navigationOptions: {
        headerVisible: false,
    }
}

const NavLogin = createStackNavigator(routeConfigs, navConfigs);
const ContainerLogin = createAppContainer(NavLogin);

export default ContainerLogin;

【问题讨论】：

您能告诉先生 indexTextInput 是如何制作的吗？
因为我认为您提供的代码没有任何问题！你的 RN 和 react-navigation 版本是什么！你能显示package.json吗
问题解决了吗？
还没有，还在发生。我的<IndexTextInput> 是<TextInput secureTextEntry={this.props.secureTextEntry} onChangeText={(value) => this.onTextChanged(value)} />。我正在使用 RN 2.0.1 和 react-navigation 3.0.9。
请在问题中发布 package.json 和 IndexTextInput！ @杰夫吉尔伯特

标签： react-native react-navigation

【解决方案1】：

createStackNavigator 和 IOS 强密码存在相同的错误。

我认为这是因为堆栈导航器不会卸载非活动组件并且 IOS 可以与它们交互。我为登录表单添加了对 onFocus 事件 (withNavigationFocus) 的订阅，并为未聚焦状态呈现空登录表单（当注册处于活动状态时）：

import { withNavigationFocus } from 'react-navigation';
...
class Login extends Component {
    Login() {

    }    
    render() {
        if (!this.props.isFocused) return null;
        return (
            <IndexBackground>
                ...
            </IndexBackground>
        )
    }
}
export default withNavigationFocus(Login);

【讨论】：

好的，我试试。
这正是我遇到的问题。注册后，我会导航到堆栈上的代码确认页面，但 iOS 必须仍然可以访问这些字段，因此它不会认为登录发生并且不会要求将密码保存到钥匙串。您的修复解决了这个问题。

【解决方案2】：

请尝试以下方法

<TextInput secureTextEntry textContentType="newPassword" />

【讨论】：

【解决方案3】：

你可以试试，添加道具：

  blurOnSubmit={false}
  autoCapitalize="none"
  onSubmitEditing={() => Keyboard.dismiss()}
  textContentType="oneTimeCode"

【讨论】：