reactjs - 使用 expo secure-store 存储和检索用户凭据并填充电子邮件和密码字段

Question

我正在 iOS 和 Android 上构建一个移动应用程序，并且我正在尝试使用 expo 的安全存储来存储用户凭据。我可以成功地存储它们，正如使用 console.log 测试的那样，但是我想要实现的是使用存储的凭据在应用程序上填充我的电子邮件和密码字段，以便用户可以简单地选择一个字段并且都被填充，从而导致更快的登录。

我已经在我的标签中放置了textContentType='email/password'和，但我不确定如何正确实现并确保这两个字段都填充了存储的信息。autoComplete='email/password'TextInput

    const authHandler = async () => {
    if (true) {
    // sign up
    } else {
    try {
    // login
      let password = localState.inputValues.password;
      await save('emailAddress', userEmail);
      await save('password', localState.inputValues.password);
      await save('userinfo', JSON.stringify({userEmail, password}));
      await getValueFor('emailAddress');
      await getValueFor('password');
      await getValueFor('userinfo');
}
    
  async function save(key, value) {
    await SecureStore.setItemAsync(key, value);
  }

  async function getValueFor(key) {
    let result = await SecureStore.getItemAsync(key);
    if (result) {
      console.log(" Here's your value  \n" + result);
    } else {
      console.log('No values stored under that key.');
    }
  }

return (

          <View style={{ paddingHorizontal: "8%" }}>
            <TextInputWrapper
              onFocus={() => {
                setEmailSelected(true);
              }}
              onBlur={() => {
                setEmailSelected(false);
              }}
              label="Email"
              onChangeText={(input) => inputChangeHandler("email", input)}
              placeholder="[e-mail]"
              value={localState.inputValues.email}
              textContentType='emailAddress'
              autoComplete='email'
            />
          </View>
        </View>
        {/* password input */}
        <View
          style={{
            paddingVertical: "2%",
            flexDirection: "row",
            alignItems: "center",
          }}
        >
          <View style={{ paddingHorizontal: "8%" }}>
            <TextInputWrapper
              onFocus={() => {
                setPwSelected(true);
              }}
              onBlur={() => {
                setPwSelected(false);
              }}
              label="Password"
              onChangeText={(input) => inputChangeHandler("password", input)}
              placeholder="At least 6 characters required"
              secureTextEntry
              value={localState.inputValues.password}
              textContentType='password'
              autoComplete='password'
            />
          </View>
        </View>

标签： reactjsexpo